@globalpayments/vega 2.61.0 → 2.63.0

package/dist/cjs/{vega-skeleton-loader-controller-9c54f3aa.js → token-extension-23ccff1d.js}

@@ -6,8 +6,14 @@ const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-11937d6f.js');
 const darkModeStyleController = require('./dark-mode-style-controller-ab0703e1.js');
-const internalVegaEventManager = require('./internal-vega-event-manager-7b87c2f4.js');
+const internalVegaEventManager = require('./internal-vega-event-manager-28b957c8.js');
 const number = require('./number-4816603d.js');
+const dtoRendererManager = require('./dto-renderer-manager-f3894490.js');
+const codeBlock = require('./code-block-eb66d852.js');
+const typeGuard = require('./type-guard-f12b5bae.js');
+const baseRenderer = require('./base-renderer-0a3b62b7.js');
+const internalIconManager = require('./internal-icon-manager-32f9ed63.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-58e3c010.js');
 
 const VegaLoaderRuntimeMetricsPayloadDefinition = [
   {
@@ -733,7 +739,7 @@ var __decorate$3 = (undefined && undefined.__decorate) || function (decorators,
   else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var __rest = (undefined && undefined.__rest) || function (s, e) {
+var __rest$1 = (undefined && undefined.__rest) || function (s, e) {
   var t = {};
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
     t[p] = s[p];
@@ -762,7 +768,7 @@ class VegaDialogController {
   open(options) {
     // eslint-disable-next-line no-restricted-globals
     const dialog = document.createElement('vega-dialog');
-    const { isVerticallyCenter, isVerticallyCentered, showCloseButton, size, title, handleClose } = options, dialogProps = __rest(options, ["isVerticallyCenter", "isVerticallyCentered", "showCloseButton", "size", "title", "handleClose"]);
+    const { isVerticallyCenter, isVerticallyCentered, showCloseButton, size, title, handleClose } = options, dialogProps = __rest$1(options, ["isVerticallyCenter", "isVerticallyCentered", "showCloseButton", "size", "title", "handleClose"]);
     dialog.id = `vega-dialog-${createPublicApiRuntimeMetricsSlimmer.generateUUID()}`;
     dialog.dialogTitle = title;
     dialog.modalProps = { isVerticallyCenter, isVerticallyCentered, showCloseButton, size, handleClose };
@@ -1291,11 +1297,681 @@ __decorate([
 ], VegaSkeletonLoaderController.prototype, "vegaPublicAPIRuntimeMetricsSlimmer", void 0);
 const VegaSkeletonLoader = new VegaSkeletonLoaderController();
 
+/**
+ * Abstract class for Vega Rich Text Editor extensions.
+ */
+class VegaRTEExtension {
+  constructor() {
+    /**
+     * The context of the RTE extension, which may include references to the host editor and other relevant information.
+     */
+    this.extensionContext = null;
+  }
+  /**
+   * 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, actionType, strategy) {
+    codeBlock.ActionHandleStrategyRegistry.register(actionType, nodeOrBlockClassName, strategy);
+  }
+  /**
+   * Initializes the RTE extension with the provided context.
+   *
+   * @param {RTEExtensionContext} context - The context of the RTE extension.
+   */
+  initialExtension(context) {
+    this.extensionContext = context;
+  }
+  /**
+   * 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.
+   */
+  registerNode(type, DTOClass) {
+    codeBlock.RTEDTOClassManager.registerRTEDTOClass(type, DTOClass);
+  }
+  /**
+   * 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.
+   */
+  registerRenderer(type, renderer) {
+    dtoRendererManager.RTEDTORendererManager.registerRTEDTORenderer(type, renderer);
+  }
+  /**
+   * Register a toolbar button renderer for the extension.
+   *
+   * @param {string} type - The type of the toolbar button.
+   * @param {VegaRTEToolbarButtonRenderer} renderer - The renderer to register.
+   */
+  registerToolbarButtonRenderer(type, renderer) {
+    dtoRendererManager.RTEDTORendererManager.registerRTEToolbarButtonRenderer(type, renderer);
+  }
+  /**
+   * 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.
+   */
+  registerBlockBasicStrategies(blockClassName) {
+    dtoRendererManager.RTEDTOActionStrategyManager.registerBlockBasicStrategies(blockClassName);
+  }
+  /**
+   * Register an element to block DTO class strategy.
+   *
+   * @param {ElementToDTOStrategy} strategy - The strategy to register.
+   */
+  registerElementToBlockDTOClassStrategy(strategy) {
+    dtoRendererManager.ElementToDTOClassStrategyManager.registerElementToBlockStrategy(strategy);
+  }
+  /**
+   * Register an element to node DTO class strategy.
+   *
+   * @param {ElementToDTOStrategy} strategy - The strategy to register.
+   */
+  registerElementToNodeDTOClassStrategy(strategy) {
+    dtoRendererManager.ElementToDTOClassStrategyManager.registerElementToNodeStrategy(strategy);
+  }
+  /**
+   * Get the registered element to node DTO class strategies.
+   *
+   * @returns {ElementToDTOStrategy[]} - The registered element to node DTO class strategies.
+   */
+  getElementToNodeDTOClassStrategies() {
+    return dtoRendererManager.ElementToDTOClassStrategyManager.getElementToNodeStrategies();
+  }
+}
+
+/**
+ * Base renderer for Vega Rich Text Editor.
+ */
+class VegaRTEExtensionRenderer extends baseRenderer.VegaRTEBaseRenderer {
+  /**
+   * Renders the given data as a DOM element.
+   *
+   * @param {RTEBlock | RTENode} renderData - The data to render, which can be a block or a node.
+   * @param {RTERenderContext} rteContext - The rte editor context.
+   * @param {VegaRTECreateElementFunction} createElement - The function to create a DOM element.
+   * @returns {VegaRTERenderResult} - The rendered DOM element.
+   */
+  render(renderData, rteContext, createElement) {
+    const element = this.doRender(createElement, renderData, rteContext);
+    this.fallbackRegisterRef(element, renderData);
+    this.appendChildren(element, renderData, rteContext, createElement);
+    return element;
+  }
+  /**
+   * Register the reference of the element in the rendering registry.
+   *
+   * @param {RTEBlock | RTENode} renderData - The data to register with the element.
+   * @returns {VegaRTEUseRef} - The function to register the element.
+   */
+  useRef(renderData) {
+    renderData[VegaRTEExtensionRenderer.REGISTER_REF_FLAG] = true;
+    return function (element) {
+      if (element) {
+        codeBlock.stateEntityRenderingRegistry.register(element, renderData);
+      }
+    };
+  }
+  /**
+   * Auto render the block children if the block element is not exist
+   *
+   * @param {VegaRTERenderResult} parentElement - The parent element to append children to.
+   * @param {RTEBlock | RTENode} renderData - The data to render children for.
+   * @param {RTERenderContext} rteContext - The render context.
+   * @param {VegaRTECreateElementFunction} createElement - The function to create a DOM element.
+   */
+  appendChildren(parentElement, renderData, rteContext, createElement) {
+    if (Array.isArray(renderData['children']) &&
+      renderData['children'].length &&
+      !parentElement['$children$']) {
+      parentElement['$children$'] = renderData['children']
+        .map((child) => {
+        return this.renderChildren(child, rteContext, createElement);
+      })
+        .filter(typeGuard.isNonNullable);
+    }
+  }
+  /**
+   * Render the children node.
+   *
+   * @param {RTENode | RTEBlock} renderData - The node to render children for.
+   * @param {RTERenderContext} rteContext - The render context.
+   * @param {VegaRTECreateElementFunction} createElement - The function to create a DOM element.
+   * @returns {Nullable<VegaRTERenderResult>} - The rendered DOM element.
+   */
+  renderChildren(renderData, rteContext, createElement) {
+    const renderer = dtoRendererManager.RTEDTORendererManager.getRTERenderer(renderData.type);
+    if (renderer) {
+      return renderer.render(renderData, rteContext, createElement);
+    }
+  }
+  /**
+   * Fallback register reference for the element.
+   *
+   * @param {VegaRTERenderResult} element - The rendered DOM element.
+   * @param {RTEBlock | RTENode} renderData - The data to register with the element.
+   */
+  fallbackRegisterRef(element, renderData) {
+    if (!renderData[VegaRTEExtensionRenderer.REGISTER_REF_FLAG] && element['$attrs$']) {
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      element['$attrs$']['ref'] = this.useRef(renderData);
+    }
+  }
+}
+VegaRTEExtensionRenderer.REGISTER_REF_FLAG = '__registeredRef__';
+
+/**
+ * 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.
+ */
+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) {
+    return editorContext.sourceEditMode;
+  }
+  /**
+   * 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.
+   */
+  renderDropdown(h, editorContext, dropdownProps, children) {
+    return h('vega-dropdown', Object.assign({ trigger: 'click', searchable: false, 
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      ref: (el) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, domNodeSubjectObserverFactory.VegaDropdownClick, (input) => this.handleDropdownClick(input.detail, editorContext));
+      } }, dropdownProps), children);
+  }
+  /**
+   * 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.
+   */
+  renderDropdownListTemplate(h, itemList) {
+    return h('div', {
+      slot: 'items',
+      onMouseDown: this.preventDefault,
+    }, itemList.map((item) => {
+      return this.renderDropdownItem(h, item);
+    }));
+  }
+  /**
+   * 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.
+   */
+  renderDropdownItem(h, item) {
+    return h('vega-dropdown-item', {
+      key: item.key,
+      itemKey: item.key,
+      label: item.label,
+      prefixIcon: item.icon,
+    });
+  }
+  /**
+   * 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.
+   */
+  renderButton(h, editorContext, buttonProps) {
+    const { icon, label, showArrowIcon } = buttonProps;
+    const isDisabled = this.isDisabled(editorContext);
+    return h('vega-rich-text-editor-toolbar-button', {
+      disabled: isDisabled,
+      icon: icon,
+      hidden: this.isHidden(editorContext),
+      selected: this.isSelected(editorContext),
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      ref: (el) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, domNodeSubjectObserverFactory.VegaClick, () => this.handleButtonClick(editorContext));
+      },
+      onMouseDown: this.preventDefault,
+    }, [
+      this.renderButtonLabel(h, editorContext, label),
+      showArrowIcon
+        ? h('vega-icon', {
+          size: 'size-8',
+          color: isDisabled ? 'text-disabled' : 'text-secondary',
+          style: { marginLeft: '8px' },
+          icon: internalIconManager.VegaInternalIconManager.getIconKey('chevron-down'),
+        })
+        : null,
+    ].filter(typeGuard.isNonNullable));
+  }
+  /**
+   * 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.
+   */
+  renderButtonLabel(h, editorContext, label) {
+    if (label) {
+      const isDisabled = this.isDisabled(editorContext);
+      return h('vega-font', {
+        variant: 'font-field-label-sm',
+        color: isDisabled ? 'text-disabled' : 'text-primary',
+      }, label);
+    }
+    return null;
+  }
+  /**
+   * 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.
+   */
+  isDisabled(editorContext) {
+    return editorContext.host.disabled;
+  }
+  /**
+   * 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.
+   */
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  isSelected(_editorContext) {
+    return false;
+  }
+  /**
+   * 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.
+   */
+  preventDefault(e) {
+    e.preventDefault();
+  }
+}
+
+/**
+ * Action to insert a token node at a specified range in the Rich Text Editor.
+ *
+ * @example block.apply(new InsertTokenNodeAction(rteRange, tokenNode));
+ */
+class InsertTokenNodeAction extends codeBlock.ModifyContentAction {
+  constructor(rteRange, token) {
+    super();
+    this.type = 'INSERT_TOKEN_NODE';
+    this.rteRange = null;
+    this.actionHandleResult = false;
+    this.rteRange = rteRange;
+    this.token = token;
+  }
+}
+
+/**
+ * Renderer for the token toolbar button in the Vega Rich Text Editor.
+ */
+class RTETokenToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  constructor(tokenList) {
+    super();
+    this.tokenList = [];
+    this.extensionContext = null;
+    this.tokenList = tokenList;
+  }
+  /**
+   * Sets the RTE extension context.
+   *
+   * @param {RTEExtensionContext} context - The context of the RTE extension.
+   */
+  injectExtensionContext(context) {
+    this.extensionContext = context;
+  }
+  /**
+   * Renders the token toolbar button.
+   *
+   * @param {VegaRTECreateElementFunction} createElement Function to create elements in the rich text editor.
+   * @param {VegaRTEToolbarRenderContext} editorContext The render context for the editor.
+   * @returns {VegaRTERenderResult} Token toolbar button.
+   */
+  render(createElement, editorContext) {
+    return this.renderDropdown(createElement, editorContext, {}, [
+      this.renderButton(createElement, editorContext, { label: 'Tokens', showArrowIcon: true }),
+      this.renderDropdownListTemplate(createElement, this.tokenList),
+    ]);
+  }
+  /**
+   * Checks if the token toolbar button is disabled.
+   *
+   * @returns {boolean} True if the button is disabled, false otherwise.
+   */
+  isDisabled() {
+    if (this.extensionContext) {
+      const { host, getSelectedNodes } = this.extensionContext;
+      const [startNode] = getSelectedNodes();
+      return startNode
+        ? host.disabled ||
+          !codeBlock.ActionHandleStrategyRegistry.canHandle('INSERT_TOKEN_NODE', startNode.parent)
+        : host.disabled;
+    }
+    return false;
+  }
+  /* istanbul ignore next */
+  /**
+   * Handles the button click event. No need this method for token button.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   */
+  handleButtonClick(editorContext) {
+  }
+  /**
+   * Handles the token item click event from the dropdown.
+   *
+   * @param {string} itemKey - The key of the clicked token item.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   */
+  handleDropdownClick(itemKey, editorContext) {
+    const token = this.tokenList.find((t) => t.key === itemKey);
+    const { rteRange } = editorContext;
+    const { startNode } = rteRange;
+    if (startNode && startNode.parent) {
+      const action = new InsertTokenNodeAction(rteRange, token);
+      startNode.parent.apply(action);
+      if (action.actionHandleResult) {
+        this.flushEditorUI();
+      }
+    }
+  }
+  /**
+   * Refreshes the editor UI.
+   */
+  flushEditorUI() {
+    if (this.extensionContext) {
+      const { host, flushValue } = this.extensionContext;
+      flushValue(host.value);
+    }
+  }
+}
+
+/**
+ * Token node for the Vega Rich Text Editor.
+ */
+class RTETokenNode extends codeBlock.RTETextNode {
+  constructor(id, token, text, parentBlock, annotations) {
+    super(id, text, parentBlock, annotations);
+    this.type = 'token';
+    this.token = token;
+    this.text = text;
+  }
+  /**
+   * @inheritDoc
+   */
+  static from(value, parent) {
+    const node = new RTETokenNode(value.id, value.token, value.text, parent);
+    if (value.annotations) {
+      node.annotationMap = this.generateTextAnnotationMap(value.annotations);
+    }
+    return node;
+  }
+  /**
+   * Converts the token node to a JSON representation.
+   *
+   * @returns {VegaRTETokenNode} - The JSON representation of the token node.
+   */
+  toJSON() {
+    const json = super.toJSON();
+    return Object.assign({ id: this.id, type: this.type, text: this.text, token: this.token }, (json.annotations ? { annotations: json.annotations } : {}));
+  }
+  /**
+   * Determines if the token node is content editable.
+   *
+   * @returns {boolean} - Always returns false for token nodes.
+   */
+  isContentEditable() {
+    return false;
+  }
+  /**
+   * Clones the token node.
+   *
+   * @returns {RTETokenNode} - The cloned token node.
+   */
+  clone() {
+    return new RTETokenNode(this.id, this.token, this.text, this.parent, this.annotationMap);
+  }
+  /**
+   * Converts the token node to an HTML representation.
+   *
+   * @returns {string} - The HTML representation of the token node.
+   */
+  toHtml() {
+    return `<span class="token" contenteditable="false" template-token-key="${this.token}" token-key="${this.token}" ${super.generateAttributeString()}>${this.text}</span>`;
+  }
+}
+
+/**
+ * Token node renderer for the rich text editor.
+ */
+class RTETokenNodeRenderer extends VegaRTEExtensionRenderer {
+  constructor() {
+    super(...arguments);
+    this.extensionContext = null;
+  }
+  /**
+   * 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, node, editorContent) {
+    const { id, token } = node;
+    return createElement('span', {
+      'key': id,
+      'template-token-key': token,
+      'token-key': token,
+      'contenteditable': 'false',
+      'style': this.getStyle(node),
+      'class': `token ${node.getClasses()}`,
+      'ref': this.useRef(node),
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      'onClick': (event) => {
+        event.preventDefault();
+        if (editorContent && editorContent.editable !== false) {
+          this.handleTokenElementClick(event, node);
+        }
+      },
+    }, node.text);
+  }
+  /**
+   * Sets the RTE extension context.
+   *
+   * @param {RTEExtensionContext} context - The context of the RTE extension.
+   */
+  injectExtensionContext(context) {
+    this.extensionContext = context;
+  }
+  /**
+   * Get the style for the token element.
+   *
+   * @param {RTETokenNode} node - The token node.
+   * @returns {Record<string, string>} The style object for the token element.
+   */
+  getStyle(node) {
+    return Object.assign(Object.assign({}, node.getStyles()), { backgroundColor: 'var(--v-bg-status-info, #CDD1D3)', padding: '0 2px', margin: '0 1px' });
+  }
+  /**
+   * Handle the click event on the token element.
+   *
+   * @param {MouseEvent} event - The click event.
+   * @param {RTETokenNode} node - The token node that was clicked.
+   */
+  handleTokenElementClick(event, node) {
+    event.preventDefault();
+    if (this.extensionContext) {
+      this.extensionContext.host.value.apply(new dtoRendererManager.UpdateCursorPositionAction(node, undefined, true));
+    }
+  }
+}
+
+/**
+ * Insert a new children to the nearest position of the parent container
+ *
+ * @example parent.apply(new InsertNodeToNearestRoot(rteRange, nodeToBeInserted))
+ */
+class InsertNodeToNearestRootAction extends codeBlock.ModifyContentAction {
+  constructor(rteRange, nodeToBeInserted) {
+    super();
+    this.type = codeBlock.ModifyContentActionType.INSERT_NODE_TO_NEAREST_ROOT;
+    this.rteRange = rteRange;
+    this.nodeToBeInserted = nodeToBeInserted;
+  }
+}
+
+/**
+ * Strategy to handle the insertion of a token node into the nearest root block.
+ */
+class InsertTokenNodeStrategy extends codeBlock.ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(action, block) {
+    const { rteRange, token } = action;
+    if (rteRange && rteRange.startNode) {
+      const tokenNode = new RTETokenNode(createPublicApiRuntimeMetricsSlimmer.generateUUID(), token.key, token.label, block);
+      block.apply(new InsertNodeToNearestRootAction(rteRange, tokenNode));
+      action.actionHandleResult = true;
+    }
+  }
+}
+
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+    t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+/**
+ * Strategy to convert <span class="token" token-key="...">...</span> to a token node
+ */
+class SpanToTokenNodeStrategy extends dtoRendererManager.ElementToDTOStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(elementsArray, currentIndex) {
+    const element = elementsArray[currentIndex];
+    if (element.nodeName === 'SPAN' &&
+      element.classList.contains('token') &&
+      element.hasAttribute('token-key')) {
+      return 1;
+    }
+    return 0;
+  }
+  /**
+   * @inheritDoc
+   */
+  handle(elementsArray) {
+    const element = elementsArray[0];
+    const tokenKey = element.getAttribute('token-key');
+    const text = element.textContent;
+    const annotations = this.generateTextStyleAnnotations(element);
+    // Exclude customAttribute and customClass from annotations
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const restAnnotations = __rest(annotations, ["customAttribute", "customClass"]);
+    return {
+      id: createPublicApiRuntimeMetricsSlimmer.generateUUID(),
+      type: 'token',
+      token: tokenKey,
+      text,
+      annotations: Object.assign({}, restAnnotations),
+    };
+  }
+  /**
+   * @inheritDoc
+   */
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  appendChildBlocks() { }
+  /**
+   * @inheritDoc
+   */
+  shouldProceedToElementChildren() {
+    return false;
+  }
+}
+
+const spanToTokenNodeStrategy = new SpanToTokenNodeStrategy();
+/**
+ * Vega Rich Text Editor Token Extension
+ */
+class VegaRTETokenExtension extends VegaRTEExtension {
+  constructor(tokenList = []) {
+    super();
+    this.tokenRenderer = new RTETokenNodeRenderer();
+    this.registerNode('token', RTETokenNode);
+    this.registerRenderer('token', this.tokenRenderer);
+    this.tokenToolbarButtonRenderer = new RTETokenToolbarButtonRenderer(tokenList);
+    this.registerToolbarButtonRenderer('token', this.tokenToolbarButtonRenderer);
+    this.registerElementToNodeDTOClassStrategy(spanToTokenNodeStrategy);
+  }
+  /**
+   * @inheritDoc
+   */
+  initialExtension(context) {
+    super.initialExtension(context);
+    this.tokenRenderer.injectExtensionContext(context);
+    if (this.tokenToolbarButtonRenderer) {
+      this.tokenToolbarButtonRenderer.injectExtensionContext(context);
+    }
+  }
+}
+(() => {
+  const insertTokenNodeStrategy = new InsertTokenNodeStrategy();
+  VegaRTEExtension.registerActionHandleStrategy(codeBlock.RTETextBlock.name, 'INSERT_TOKEN_NODE', insertTokenNodeStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(dtoRendererManager.RTEListItemBlock.name, 'INSERT_TOKEN_NODE', insertTokenNodeStrategy);
+})();
+
+exports.InsertNodeToNearestRootAction = InsertNodeToNearestRootAction;
 exports.InternalVegaZIndexManager = InternalVegaZIndexManager$1;
+exports.RTETokenNode = RTETokenNode;
+exports.RTETokenNodeRenderer = RTETokenNodeRenderer;
+exports.RTETokenToolbarButtonRenderer = RTETokenToolbarButtonRenderer;
 exports.VegaDialog = VegaDialog;
 exports.VegaEventManager = VegaEventManager$1;
 exports.VegaLoader = VegaLoader;
 exports.VegaNotify = VegaNotify;
+exports.VegaRTEExtension = VegaRTEExtension;
+exports.VegaRTEExtensionRenderer = VegaRTEExtensionRenderer;
+exports.VegaRTETokenExtension = VegaRTETokenExtension;
+exports.VegaRTEToolbarButtonRenderer = VegaRTEToolbarButtonRenderer;
 exports.VegaSkeletonLoader = VegaSkeletonLoader;
 exports.VegaThemeManager = VegaThemeManager;
 exports.VegaZIndexManager = VegaZIndexManager$1;