@globalpayments/vega 2.91.0 → 2.93.0

package/dist/esm/{token-extension-8ff92d14.js → token-extension-ecfafe94.js}

@@ -5,27 +5,29 @@ import { I as InjectVegaTelemetrySlimmer, c as createPublicAPIRuntimeMetricsSlim
 import { I as InternalVegaZIndexManager } from './internal-vega-z-index-manager-7d2b54c3.js';
 import { c as createDynamicSlimmer } from './dynamic-slimmer-90b8af32.js';
 import { P as PageResizeObserverSlimmer } from './page-resize-observer-slimmer-e24d36c5.js';
-import { i as internalVegaEventManager } from './internal-vega-event-manager-956cf128.js';
-import { V as VegaInternalTranslation } from './internal-translation-controller-aa09ca87.js';
-import { I as InternalCalendarPeriodConverter } from './internal-calendar-period-factory-fff8aaee.js';
-import { U as UpdateCursorPositionAction, V as VegaRTEContent, B as BlockToRTEBlockStrategyAbstract, E as ElementToDTOStrategy, h as htmlElementToAnnotationGenerator, I as InsertNewParagraphAction, R as RTEImageBlock, a as InsertChildrenBeforeStrategy, P as PasteContentStrategy, A as AnnotationGeneratorStrategyAbstract, b as RTEListItemBlock } from './content-state-67950b80.js';
-import { R as RTEExtensionContextManager, a as VegaRTEExtensionRenderer, b as VegaRTEExtension } from './link-extension-afb404fb.js';
-import { M as ModifyContentAction, A as ActionHandleStrategyRegistry, R as RTETextNode, a as RTEBlock, b as RTETextBlock, c as RTEAnnotationStyle, d as ActionHandleStrategy, I as InsertChildrenAfterAction, e as AppendChildrenAction, f as RTENode, s as stateEntityRenderingRegistry, g as InsertChildrenBeforeAction, h as InternalAnnotationTypeEnum, i as ModifyContentActionType, B as BlockAnnotation, j as AnnotationAction, k as RemoveChildrenAction, C as CommonAnnotationTypeEnum, l as CustomAttributeAnnotation, m as RTEDTOClassManager, n as RTEFilterStylesStrategy, o as RTEDecoratorNode, S as SplitBlockWithNodeAction, U as UpdateTextAction, N as NodeAnnotationTypeEnum, p as RTECodeBlock, q as CustomStyleAnnotation, r as RTEFilterStylesStrategyRegistry } from './code-block-37294847.js';
-import { i as isNonNullable } from './type-guard-a2cbaae9.js';
+import { i as internalVegaEventManager } from './internal-vega-event-manager-48690e5b.js';
+import { V as VegaInternalTranslation } from './internal-translation-controller-09b8bd13.js';
+import { I as InternalCalendarPeriodConverter } from './internal-calendar-period-factory-6f19d767.js';
+import { R as RTEExtensionContextManager, a as VegaRTEExtensionRenderer, b as VegaRTEExtension } from './link-extension-74eaa826.js';
+import { U as UpdateCursorPositionAction, V as VegaRTEContent, B as BlockToRTEBlockStrategyAbstract, E as ElementToDTOStrategy, h as htmlElementToAnnotationGenerator, I as InsertNewParagraphAction, R as RTEImageBlock, a as InsertChildrenBeforeStrategy, P as PasteContentStrategy, A as AnnotationGeneratorStrategyAbstract, b as RTEListItemBlock } from './content-state-c3b85ae6.js';
+import { M as ModifyContentAction, A as ActionHandleStrategyRegistry, R as RTETextNode, a as RTEBlock, b as RTETextBlock, c as RTEAnnotationStyle, d as ActionHandleStrategy, I as InsertChildrenAfterAction, e as AppendChildrenAction, f as RTENode, s as stateEntityRenderingRegistry, g as InsertChildrenBeforeAction, h as InternalAnnotationTypeEnum, i as ModifyContentActionType, B as BlockAnnotation, j as AnnotationAction, k as RemoveChildrenAction, C as CommonAnnotationTypeEnum, l as CustomAttributeAnnotation, m as RTEDTOClassManager, n as RTEFilterStylesStrategy, o as RTEDecoratorNode, S as SplitBlockWithNodeAction, U as UpdateTextAction, p as RTECodeBlock, q as RTECodeBlockNode, N as NodeAnnotationTypeEnum, r as CustomStyleAnnotation, t as RTEFilterStylesStrategyRegistry } from './code-block-ae2337c2.js';
+import { i as isNonNullable } from './type-guard-2bfb2c7b.js';
 import { V as VegaInternalIconManager } from './internal-icon-manager-e7c57096.js';
 import { v as vegaNonceManager } from './vega-nonce-manager-497e5eb5.js';
 import { D as DomNodeSubjectObserverFactory, d as domNodeSubjectFactory } from './dom-node-subject-observer-factory-ddff8662.js';
-import { V as VegaDropdownClick, a as VegaClick, b as VegaPopoverHide, c as VegaPopoverShow } from './vega-event-id-268f8def.js';
-import { R as RTETableExtensionAnnotationTypeEnum, a as RTE_TABLE_HEAD_DEFAULT_BACKGROUND_COLOR, S as SettingEventHandler, T as TableSettingType, b as RTETableAnnotation, c as RTETableCellAnnotation, d as RTETableHeadCellBlock, e as RowOperationEventHandler, C as ColumnOperationEventHandler, M as MergeCellsOperationEventHandler, f as SplitCellOperationEventHandler, g as RTETableColorManager, h as RTETableBlock, i as generateTableBody, j as RTETableCellBlock, k as RTETableHeadBlock, l as RTETableBodyBlock, m as getParentBlockByType, n as RTETableHeadCellAnnotation, o as TableColumnStrategy, p as getAllTableRows, q as buildTableGrid, s as setSpanAttributes, r as findCellBlockById, t as getDefaultCellBlockTemplate, I as InsertTableColumnDirection, u as buildCellStartColumnMap, v as getTableColumnCount, w as getFirstNode, x as getCellSpan, y as createNewCell, z as MergeCellsOperationType, A as RTETableRowBlock, B as getActualColumnPosition, D as InsertTableRowDirection, E as RTE_TABLE_DEFAULT_COLORS, F as INSERT_TABLE_ROW_INTO_DIFFERENT_SECTION, G as INSERT_TABLE_ROW_INTO_SAME_SECTION, H as DELETE_TABLE_ROW, J as TOGGLE_HEADER_ROW, K as INSERT_TABLE_COLUMN, L as DELETE_TABLE_COLUMN, N as TOGGLE_HEADER_TABLE_COLUMN, O as ToggleHeaderTableColumnStrategy, P as SPLIT_TABLE_CELL, Q as REPLACE_TABLE_CELL, U as SPLIT_CELL_HORIZONTALLY, W as SPLIT_CELL_VERTICALLY, X as SELECT_TABLE_COLUMN, Y as MERGE_CELLS } from './split-cell-operation-c515669e.js';
+import { V as VegaDropdownClick, a as VegaClick, b as VegaPopoverHide, c as VegaPopoverShow, d as VegaChange } from './vega-event-id-270fe47e.js';
+import { R as RTETableExtensionAnnotationTypeEnum, a as RTE_TABLE_HEAD_DEFAULT_BACKGROUND_COLOR, S as SettingEventHandler, T as TableSettingType, b as RTETableAnnotation, c as RTETableCellAnnotation, d as RTETableHeadCellBlock, e as RowOperationEventHandler, C as ColumnOperationEventHandler, M as MergeCellsOperationEventHandler, f as SplitCellOperationEventHandler, g as RTETableColorManager, h as RTETableBlock, i as generateTableBody, j as RTETableCellBlock, k as RTETableHeadBlock, l as RTETableBodyBlock, m as getParentBlockByType, n as RTETableHeadCellAnnotation, o as TableColumnStrategy, p as getAllTableRows, q as buildTableGrid, s as setSpanAttributes, r as findCellBlockById, t as getDefaultCellBlockTemplate, I as InsertTableColumnDirection, u as buildCellStartColumnMap, v as getTableColumnCount, w as getFirstNode, x as getCellSpan, y as createNewCell, z as MergeCellsOperationType, A as RTETableRowBlock, B as getActualColumnPosition, D as InsertTableRowDirection, E as RTE_TABLE_DEFAULT_COLORS, F as INSERT_TABLE_ROW_INTO_DIFFERENT_SECTION, G as INSERT_TABLE_ROW_INTO_SAME_SECTION, H as DELETE_TABLE_ROW, J as TOGGLE_HEADER_ROW, K as INSERT_TABLE_COLUMN, L as DELETE_TABLE_COLUMN, N as TOGGLE_HEADER_TABLE_COLUMN, O as ToggleHeaderTableColumnStrategy, P as SPLIT_TABLE_CELL, Q as REPLACE_TABLE_CELL, U as SPLIT_CELL_HORIZONTALLY, W as SPLIT_CELL_VERTICALLY, X as SELECT_TABLE_COLUMN, Y as MERGE_CELLS } from './split-cell-operation-98d58410.js';
 import { C as ChangeManager } from './change-manager-6a7eb88c.js';
-import { V as VegaInternalRTEExtensionTableCellsSelectionAnchor, a as VegaInternalPopoverUpdateTarget, b as VegaInternalRTEExtensionTableCellSelectionChange } from './vega-internal-event-id-22151a4d.js';
+import { V as VegaInternalRTEExtensionTableCellsSelectionAnchor, a as VegaInternalPopoverUpdateTarget, b as VegaInternalRTEExtensionTableCellSelectionChange } from './vega-internal-event-id-827eb1ce.js';
 import { r as remoteInvocationRegistry } from './remote-invocation-registry-d69245c2.js';
-import { V as VegaInternalThemeManager } from './dark-mode-style-controller-ca5afd2d.js';
+import { V as VegaInternalThemeManager, a as VegaDarkModeStyleController } from './dark-mode-style-controller-ca5afd2d.js';
 import { t as tryGetDocument } from './try-get-document-bef0f526.js';
 import { p as parseToPixelString } from './pixel-f32c07ce.js';
 import { c as cleanObject } from './object-0c277f57.js';
 import { d as debounce } from './timer-9321173b.js';
-import { R as ReplaceSelectedTextAction } from './replace-selected-text-action-12bc8b82.js';
+import { c as camelToDashCase } from './string-a953eafc.js';
+import { R as ReplaceSelectedTextAction } from './replace-selected-text-action-c9278a0f.js';
+import { c as copy } from './copy-54e45e2d.js';
 
 const VegaLoaderRuntimeMetricsPayloadDefinition = [
   {
@@ -1767,7 +1769,7 @@ class VegaRTELanguageExtension extends VegaRTEExtension {
    */
   prepareBeforeLoad(host) {
     this.languageToolbarButtonRenderer = new RTELanguageToolbarButtonRenderer(this.languageList, this.languageChangeCallBack, this.languageState.selectedLanguage);
-    this.registerToolbarButtonRenderer('languages', this.languageToolbarButtonRenderer, host);
+    this.registerToolbarButtonRenderer(VegaRTELanguageExtension.TOOLBAR_BUTTON_KEY, this.languageToolbarButtonRenderer, host);
   }
   /**
    * Initializes the language extension.
@@ -1859,6 +1861,7 @@ class VegaRTELanguageExtension extends VegaRTEExtension {
     return result;
   }
 }
+VegaRTELanguageExtension.TOOLBAR_BUTTON_KEY = 'languages';
 
 const INSERT_FUNCTION_BLOCK = 'INSERT_FUNCTION_BLOCK';
 /**
@@ -2651,7 +2654,7 @@ class VegaRTEFunctionExtension extends VegaRTEExtension {
   }
   /** @inheritDoc */
   prepareBeforeLoad(host) {
-    this.registerToolbarButtonRenderer('functions', new FunctionToolbarButtonRenderer(), host);
+    this.registerToolbarButtonRenderer(VegaRTEFunctionExtension.TOOLBAR_BUTTON_KEY, new FunctionToolbarButtonRenderer(), host);
   }
   /**
    * Remove the appen children strategies to prevent default insert new paragraph logic in function block
@@ -2675,6 +2678,7 @@ class VegaRTEFunctionExtension extends VegaRTEExtension {
   VegaRTEExtension.registerActionHandlerInterceptor(RTETextBlock.name, ModifyContentActionType.INSERT_NEW_PARAGRAPH, new PreventNewParagraphInterceptor());
   VegaRTEExtension.registerActionHandlerInterceptor(RTETextBlock.name, ModifyContentActionType.PASTE_CONTENT, new PreventPasteContentInterceptor());
 })();
+VegaRTEFunctionExtension.TOOLBAR_BUTTON_KEY = 'functions';
 
 const tableBlockStylesCss = ".v-rte--extension-table-container{display:table}table.v-rte--extension-table{border-collapse:collapse}table.v-rte--extension-table th,table.v-rte--extension-table td{border:1px solid #ddd;padding:12px;text-align:left;vertical-align:middle;min-width:55px;box-sizing:border-box;position:relative}table.v-rte--extension-table th{background-color:#f2f2f2}.rte-table-setting-popover,.rte-table-dynamic-popover{display:block}table.v-rte--extension-table .v-rte-table-cell-focused::after,table.v-rte--extension-table .v-rte-table-cell-selected::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;background-color:rgba(158, 207, 250, 0.3)}table.v-rte--extension-table:has(.v-rte-table-cell-selected){caret-color:transparent}table.v-rte--extension-table:has(.v-rte-table-cell-selected) ::selection{background-color:transparent}table.v-rte--extension-table:has(.v-rte-table-cell-selected) ::-moz-selection{background-color:transparent}.v-rte--extension-table-caption{padding:8px;border:1px solid #ddd;border-bottom:none;background-color:rgba(var(--v-bg-table-header, 240, 243, 247, 1));position:relative;display:table-caption;caption-side:top;min-height:22px;text-align:center;word-break:break-word;overflow-wrap:break-word}.v-rte--extension-table-caption.showPlaceholder::before{position:absolute;left:0;right:0;content:attr(data-placeholder);font-family:'Inter', sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0;color:rgba(var(--v-text-input-placeholder, 176, 180, 181, 1));text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}";
 
@@ -3801,7 +3805,7 @@ class RTETableBlockRenderer extends VegaRTEExtensionRenderer {
    * @param {HTMLElement} tableRef - The element that can triggered the table popover open.
    */
   handleTableRemove(renderData, tableRef) {
-    renderData.parent.apply(new DeleteTableBlockAction(renderData));
+    renderData.apply(new DeleteTableBlockAction(renderData));
     this.destroySelectionAnchor(tableRef);
   }
   /**
@@ -7311,7 +7315,7 @@ class VegaRTETableExtension extends VegaRTEExtension {
     this.tableHeadCellRenderer = new RTETableHeadCellRenderer();
     this.tableSelection = new RTETableSelection();
     RTETableColorManager.setTableColors(colors);
-    this.registerToolbarButtonRenderer('table', this.toolbarButtonRenderer);
+    this.registerToolbarButtonRenderer(VegaRTETableExtension.TOOLBAR_BUTTON_KEY, this.toolbarButtonRenderer);
     this.registerBlockBasicStrategies(RTETableBlock.name);
     this.registerBlockBasicStrategies(RTETableHeadBlock.name);
     this.registerBlockBasicStrategies(RTETableHeadCellBlock.name);
@@ -7365,9 +7369,10 @@ class VegaRTETableExtension extends VegaRTEExtension {
   const insertTableBlockStrategy = new InsertTableBlockStrategy();
   const deleteTableBlockStrategy = new DeleteTableBlockStrategy();
   VegaRTEExtension.registerActionHandleStrategy(VegaRTEContent.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
-  VegaRTEExtension.registerActionHandleStrategy(VegaRTEContent.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
-  VegaRTEExtension.registerActionHandleStrategy(RTETableCellBlock.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
-  VegaRTEExtension.registerActionHandleStrategy(RTETableHeadCellBlock.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
+  // Registered on the table block itself (not its parent) so a table can always be
+  // deleted regardless of which block type it is nested in (root content, table cell,
+  // blockquote, or any future container).
+  VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, DELETE_TABLE_BLOCK, deleteTableBlockStrategy);
   VegaRTEExtension.registerActionHandleStrategy(RTETextBlock.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
   VegaRTEExtension.registerActionHandleStrategy(RTEImageBlock.name, INSERT_TABLE_BLOCK, insertTableBlockStrategy);
   VegaRTEExtension.registerActionHandleStrategy(RTETableBlock.name, INSERT_TABLE_ROW_INTO_DIFFERENT_SECTION, new InsertTableRowIntoDifferentSectionStrategy());
@@ -7399,6 +7404,7 @@ class VegaRTETableExtension extends VegaRTEExtension {
   VegaRTEExtension.registerFilterStylesStrategy(RTETableCellBlock.dtoName, new TableCellFilterStylesStrategy());
   VegaRTEExtension.registerFilterStylesStrategy(RTETableHeadCellBlock.dtoName, new TableCellFilterStylesStrategy('th'));
 })();
+VegaRTETableExtension.TOOLBAR_BUTTON_KEY = 'table';
 
 /**
  * Horizontal line node — a decorator node representing `<hr>` in the editor.
@@ -7896,7 +7902,7 @@ class VegaRTEHorizontalLineExtension extends VegaRTEExtension {
     // Register the renderer
     this.registerRenderer('horizontal-line', this.blockRenderer);
     // Register the toolbar button
-    this.registerToolbarButtonRenderer('horizontalLine', this.toolbarButtonRenderer);
+    this.registerToolbarButtonRenderer(VegaRTEHorizontalLineExtension.TOOLBAR_BUTTON_KEY, this.toolbarButtonRenderer);
     // Register HTML → DTO conversion strategy
     this.registerElementToBlockDTOClassStrategy(new HrToHorizontalLineBlockStrategy());
     // Register filter styles strategy for source edit round-trip
@@ -7911,6 +7917,695 @@ class VegaRTEHorizontalLineExtension extends VegaRTEExtension {
   VegaRTEExtension.registerActionHandleStrategy(RTEImageBlock.name, INSERT_HORIZONTAL_LINE_BLOCK, insertStrategy);
   VegaRTEExtension.registerActionHandleStrategy(RTEHorizontalLineBlock.name, INSERT_HORIZONTAL_LINE_BLOCK, insertStrategy);
 })();
+VegaRTEHorizontalLineExtension.TOOLBAR_BUTTON_KEY = 'horizontalLine';
+
+var RTEBlockquoteExtensionAnnotationTypeEnum;
+(function (RTEBlockquoteExtensionAnnotationTypeEnum) {
+  RTEBlockquoteExtensionAnnotationTypeEnum["BLOCKQUOTE"] = "BLOCKQUOTE";
+})(RTEBlockquoteExtensionAnnotationTypeEnum || (RTEBlockquoteExtensionAnnotationTypeEnum = {}));
+/**
+ * CSS class applied to `<blockquote>` elements rendered inside the editor.
+ */
+const BLOCKQUOTE_CLASS_NAME = 'v-rte-blockquote';
+/**
+ * Default visual styles for the `<blockquote>` element in the RTE.
+ */
+const BLOCKQUOTE_DEFAULT_STYLES = {
+  overflow: 'hidden',
+  marginInline: '0',
+  paddingInline: '24px',
+  borderInlineStart: 'solid 5px hsl(0, 0%, 80%)',
+};
+/**
+ * Blockquote annotation.
+ */
+class BlockquoteAnnotation extends BlockAnnotation {
+  constructor() {
+    super(...arguments);
+    this.type = RTEBlockquoteExtensionAnnotationTypeEnum.BLOCKQUOTE;
+  }
+  /**
+   * Generate the map item for the annotation.
+   *
+   * @returns {[RTEBlockquoteExtensionAnnotationTypeEnum.BLOCKQUOTE, BlockquoteAnnotation]} Map item.
+   */
+  static from() {
+    return [RTEBlockquoteExtensionAnnotationTypeEnum.BLOCKQUOTE, new BlockquoteAnnotation()];
+  }
+  /**
+   * Get the default CSS rule for the blockquote element.
+   *
+   * @returns {string} The default CSS rule.
+   */
+  static getDefaultCssText() {
+    const declarations = Object.entries(BLOCKQUOTE_DEFAULT_STYLES)
+      .map(([key, value]) => `\t${camelToDashCase(key)}: ${value};`)
+      .join('\n');
+    return `.${BLOCKQUOTE_CLASS_NAME} {\n${declarations}\n}`;
+  }
+  /**
+   * @inheritDoc
+   */
+  toJSON() {
+    // Blockquote identity is captured by the block type; nothing to serialize.
+    return null;
+  }
+  /**
+   * @inheritDoc
+   */
+  clone() {
+    return new BlockquoteAnnotation();
+  }
+  /**
+   * @inheritDoc
+   */
+  renderClass(options) {
+    if (options === null || options === void 0 ? void 0 : options.standalone)
+      return null;
+    return BLOCKQUOTE_CLASS_NAME;
+  }
+  /**
+   * @inheritDoc
+   */
+  renderStyle(options) {
+    if (!(options === null || options === void 0 ? void 0 : options.standalone))
+      return null;
+    return BLOCKQUOTE_DEFAULT_STYLES;
+  }
+}
+
+/**
+ * DTO representing a `<blockquote>` block.
+ */
+class RTEBlockquoteBlock extends RTEBlock {
+  constructor(id, options) {
+    super(id);
+    this.dtoName = RTEBlockquoteBlock.dtoName;
+    this.type = 'blockquote';
+    this.children = [];
+    const { autoMatchFormat = true } = options !== null && options !== void 0 ? options : {};
+    if (autoMatchFormat) {
+      this.annotationMap = new Map([BlockquoteAnnotation.from()]);
+    }
+  }
+  /**
+   * Convert a JSON block payload into an `RTEBlockquoteBlock` instance.
+   *
+   * @param {VegaRTEBlockquoteBlock} block - JSON payload.
+   * @param {VegaRTETransformOptions} [options] - Transform options.
+   * @returns {RTEBlockquoteBlock} The created blockquote block.
+   */
+  static from(block, options) {
+    const blockquote = new RTEBlockquoteBlock(block.id, options);
+    if (block.annotations) {
+      RTEBlock.convertAnnotationsToMap(blockquote.annotationMap, block.annotations);
+    }
+    blockquote.children = RTEBlock.generateBlockChildren(block.children, options, blockquote);
+    return blockquote;
+  }
+  /**
+   * @inheritDoc
+   */
+  clone(parent) {
+    const cloned = new RTEBlockquoteBlock(this.id);
+    const clonedAsChildParent = cloned;
+    cloned.children = this.children.map((child) => child.clone(clonedAsChildParent));
+    cloned.annotationMap = this.cloneAnnotations();
+    cloned.parent = parent;
+    return cloned;
+  }
+  /**
+   * @inheritDoc
+   */
+  getLastNode() {
+    return this.children[this.children.length - 1].getLastNode();
+  }
+  /**
+   * @inheritDoc
+   */
+  isNotEmpty() {
+    return this.children.length > 0;
+  }
+  /**
+   * @inheritDoc
+   */
+  toHtml(options) {
+    const attrStr = this.generateAttributeString(options);
+    const inner = this.children.map((child) => child.toHtml(options)).join('');
+    return `<blockquote${attrStr}>${inner}</blockquote>`;
+  }
+  /**
+   * @inheritDoc
+   */
+  toJSON() {
+    return Object.assign(Object.assign({}, super.toJSON()), { id: this.id, type: 'blockquote', children: this.children.map((child) => child.toJSON()) });
+  }
+}
+RTEBlockquoteBlock.dtoName = 'RTEBlockquoteBlock';
+
+/**
+ * Wrap the selected blocks into a new `<blockquote>` block while preserving
+ * their order.
+ */
+class BlockTransformToBlockquoteStrategy extends ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(action, target) {
+    const selectedBlocks = action.selectedBlocks;
+    const children = target.children;
+    const selectedSet = new Set(selectedBlocks);
+    const firstIndex = children.indexOf(selectedBlocks[0]);
+    // The selected blocks may not be contiguous in `children` (e.g. a table
+    // sitting between two selected paragraphs must stay untouched), so the
+    // insert position is the first selected block's index, adjusted for any
+    // non-selected siblings that come before it.
+    const insertIndex = children
+      .slice(0, firstIndex)
+      .filter((block) => !selectedSet.has(block)).length;
+    const blockquote = new RTEBlockquoteBlock(generateUUID());
+    blockquote.parent = target;
+    blockquote.children = selectedBlocks;
+    selectedBlocks.forEach((block) => {
+      block.parent = blockquote;
+    });
+    // Remove selected blocks individually rather than assuming a single
+    // contiguous run, so non-selected siblings interleaved with the
+    // selection (e.g. a table) are preserved instead of being spliced away.
+    for (let i = children.length - 1; i >= 0; i--) {
+      if (selectedSet.has(children[i])) {
+        children.splice(i, 1);
+      }
+    }
+    children.splice(insertIndex, 0, blockquote);
+  }
+}
+
+/**
+ * Unwrap a `<blockquote>` — lift its children to the parent in their original
+ * order and remove the blockquote.
+ */
+class RemoveBlockquoteStrategy extends ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(_action, target) {
+    const parent = target.parent;
+    const childrenToLift = [...target.children];
+    if (childrenToLift.length > 0) {
+      parent.apply(new InsertChildrenBeforeAction(target, ...childrenToLift));
+    }
+    parent.apply(new RemoveChildrenAction(target));
+  }
+}
+
+/**
+ * Lets the caret exit the blockquote via the keyboard. Pressing Enter on an empty
+ * trailing paragraph inside a blockquote (i.e. the second Enter press at the end of
+ * the quote) moves that empty paragraph out to a new paragraph after the blockquote,
+ * instead of stacking another empty line inside the quote.
+ */
+class BlockquoteExitOnEnterInterceptor extends ActionHandlerInterceptor {
+  /**
+   * Intercept only when the caret sits in an empty paragraph that is the last child of a blockquote.
+   *
+   * @param {InsertNewParagraphAction} _action - the action to be intercepted
+   * @param {RTETextBlock} target - the paragraph block receiving the Enter key press
+   * @returns {boolean} - whether the action should be intercepted
+   */
+  canIntercept(_action, target) {
+    const parent = target.parent;
+    return (parent instanceof RTEBlockquoteBlock &&
+      !target.isNotEmpty() &&
+      parent.children[parent.children.length - 1] === target);
+  }
+  /**
+   * Move the empty paragraph out of the blockquote and place a new paragraph after it.
+   *
+   * @param {ActionHandlerExecution} _execution - the original execution function
+   * @param {InsertNewParagraphAction} action - the action containing insert metadata
+   * @param {RTETextBlock} target - the empty paragraph block to move out of the blockquote
+   */
+  intercept(_execution, action, target) {
+    const blockquote = target.parent;
+    const newParagraph = this.createNewParagraph('');
+    if (newParagraph) {
+      // Insert the replacement paragraph after the blockquote before removing the
+      // empty one so the blockquote is still present as an anchor for the insert.
+      blockquote.parent.apply(new InsertChildrenAfterAction(blockquote, newParagraph));
+      blockquote.apply(new RemoveChildrenAction(target));
+      action.newBlock = newParagraph;
+    }
+  }
+  /**
+   * Create a new empty paragraph block.
+   *
+   * @param {string} text - paragraph text
+   * @returns {Nullable<RTETextBlock>} - paragraph block when paragraph dto class is available
+   */
+  createNewParagraph(text) {
+    const dtoClass = RTEDTOClassManager.getRTEBlockClass('paragraph');
+    if (dtoClass) {
+      return dtoClass.from({
+        id: generateUUID(),
+        type: 'paragraph',
+        nodes: [{ id: generateUUID(), type: 'text', text }],
+      });
+    }
+  }
+}
+
+/**
+ * Action type discriminator. Plain string constant — intentionally NOT added
+ * to {@link ModifyContentActionType} enum to keep the extension self-contained.
+ */
+const TRANSFORM_TO_BLOCKQUOTE = 'TRANSFORM_TO_BLOCKQUOTE';
+/**
+ * Wrap the supplied blocks into a new `<blockquote>` block while preserving
+ * their order. Strategy reads `selectedBlocks` and replaces them in-place
+ * with a single `RTEBlockquoteBlock` that adopts them as children.
+ */
+class TransformToBlockquoteAction extends ModifyContentAction {
+  constructor(selectedBlocks) {
+    super();
+    this.isFlushable = true;
+    this.type = TRANSFORM_TO_BLOCKQUOTE;
+    this.selectedBlocks = selectedBlocks;
+  }
+}
+
+/**
+ * Action type discriminator. Plain string constant — intentionally NOT added
+ * to {@link ModifyContentActionType} enum to keep the extension self-contained.
+ */
+const REMOVE_BLOCKQUOTE = 'REMOVE_BLOCKQUOTE';
+/**
+ * Unwrap a `<blockquote>` block — lift its children into the parent in place
+ * and remove the blockquote wrapper. Targets the blockquote block itself.
+ */
+class RemoveBlockquoteAction extends ModifyContentAction {
+  constructor() {
+    super(...arguments);
+    this.isFlushable = true;
+    this.type = REMOVE_BLOCKQUOTE;
+  }
+}
+
+/**
+ * Claim every `<blockquote>` element encountered during HTML → DTO conversion
+ * and produce an {@link RTEBlockquoteBlock}.
+ *
+ * Nested `<blockquote>` elements are flattened to a single level in
+ * {@link appendChildBlocks}: any direct child that arrives as another
+ * `<blockquote>` is replaced by its own children, lifting them one level up.
+ */
+class BlockquoteToBlockquoteBlockStrategy extends ElementToDTOStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(elementsArray, currentIndex) {
+    return elementsArray[currentIndex].tagName === 'BLOCKQUOTE' ? 1 : 0;
+  }
+  /**
+   * @inheritDoc
+   */
+  handle(elementsArray, options) {
+    const element = elementsArray[0];
+    const annotations = htmlElementToAnnotationGenerator.generate(RTEBlockquoteBlock, element, options);
+    return RTEBlockquoteBlock.from({
+      id: generateUUID(),
+      type: 'blockquote',
+      annotations,
+      children: [],
+    }, options);
+  }
+  /**
+   * Flatten nested `<blockquote>` elements: any direct child that is itself
+   * an {@link RTEBlockquoteBlock} is replaced by its own children, lifting
+   * them one level up.
+   *
+   * @inheritDoc
+   */
+  appendChildBlocks(currentBlock, childBlocks) {
+    const flattened = childBlocks.flatMap((child) => child instanceof RTEBlockquoteBlock ? child.children : [child]);
+    currentBlock.children = flattened.map((block) => {
+      block.parent = currentBlock;
+      return block;
+    });
+  }
+  /**
+   * @inheritDoc
+   */
+  shouldProceedToElementChildren() {
+    return true;
+  }
+}
+
+/**
+ * Renderer for blockquote blocks in the rich text editor.
+ */
+class RTEBlockquoteBlockRenderer extends VegaRTEExtensionRenderer {
+  /**
+   * @inheritDoc
+   */
+  doRender(createElement, block, rteContext) {
+    var _a;
+    return createElement('blockquote', Object.assign({ key: block.id, class: block.getClasses(rteContext), style: block.getStyles(rteContext), ref: this.useRef(block) }, (_a = block.getCustomAttributesAnnotation()) === null || _a === void 0 ? void 0 : _a.render()));
+  }
+  /**
+   * @inheritDoc
+   */
+  injectRTEScopeStyles() {
+    return BlockquoteAnnotation.getDefaultCssText();
+  }
+}
+const RTEBlockquoteBlockRenderer$1 = new RTEBlockquoteBlockRenderer();
+
+// FontAwesome 7.2.0 — `quote-left` (solid).
+const QuoteLeftIcon = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M0 216C0 149.7 53.7 96 120 96l8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-8 0c-30.9 0-56 25.1-56 56l0 8 64 0c35.3 0 64 28.7 64 64l0 64c0 35.3-28.7 64-64 64l-64 0c-35.3 0-64-28.7-64-64L0 216zm256 0c0-66.3 53.7-120 120-120l8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-8 0c-30.9 0-56 25.1-56 56l0 8 64 0c35.3 0 64 28.7 64 64l0 64c0 35.3-28.7 64-64 64l-64 0c-35.3 0-64-28.7-64-64l0-136z"/></svg>`,
+};
+
+/**
+ * Toolbar button renderer for the blockquote extension.
+ *
+ * Behaviors implemented:
+ * - Active (`selected`) when the caret/selection is inside any blockquote
+ *   ancestor.
+ * - Click wraps the current block(s) into a new `<blockquote>`, or unwraps
+ *   the nearest blockquote ancestor when active. Inside a list, the entire
+ *   list is wrapped (escalating to the outermost list block). With no
+ *   selection, a new empty blockquote is appended at the end and focused.
+ * - Disabled when the wrap container does not support the wrap strategy
+ *   (e.g. inside a code block or function block); the button remains
+ *   enabled inside a blockquote so it can be toggled off, and with no
+ *   selection so it can append a new blockquote.
+ * - Hidden in source-edit mode (inherited from {@link VegaRTEToolbarButtonRenderer}).
+ */
+class RTEBlockquoteToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  /**
+   * @inheritDoc
+   */
+  render(createElement, editorContext) {
+    return this.renderButton(createElement, editorContext, {
+      icon: 'quote-left',
+      tooltip: { text: 'Block quote' },
+    });
+  }
+  /**
+   * @inheritDoc
+   */
+  isSelected(editorContext) {
+    const startNode = this.getStartNode(editorContext);
+    return startNode ? this.findBlockquoteAncestor(startNode) !== null : false;
+  }
+  /**
+   * @inheritDoc
+   */
+  isDisabled(editorContext) {
+    if (editorContext.host.disabled) {
+      return true;
+    }
+    const startNode = this.getStartNode(editorContext);
+    // No selection — click appends a new blockquote at the end.
+    // Inside a blockquote — click toggles it off.
+    // Either way, the button stays enabled.
+    if (!startNode || this.findBlockquoteAncestor(startNode) !== null) {
+      return false;
+    }
+    const { container } = this.resolveWrapAnchor(startNode.parent);
+    return !ActionHandleStrategyRegistry.canHandle(TRANSFORM_TO_BLOCKQUOTE, container);
+  }
+  /**
+   * @inheritDoc
+   */
+  handleButtonClick(editorContext) {
+    const context = this.getExtensionContext(editorContext.host);
+    if (context) {
+      const { host, getSelectedNodes } = context;
+      const selectedNodes = getSelectedNodes();
+      const startNode = selectedNodes[0];
+      if (!startNode) {
+        // No active selection → append a new empty blockquote at the end (mirrors text-style toolbar).
+        this.appendEmptyBlockquote(host.value);
+        return;
+      }
+      // Direction is decided by the first selected block only.
+      if (this.findBlockquoteAncestor(startNode)) {
+        const blockquoteAncestors = this.collectBlockquoteAncestors(selectedNodes);
+        blockquoteAncestors.forEach((blockquote) => {
+          blockquote.apply(new RemoveBlockquoteAction());
+        });
+      }
+      else {
+        this.wrapSelectedBlocks(selectedNodes);
+      }
+      host.value.apply(new UpdateCursorPositionAction(startNode, editorContext.rteRange.startOffset));
+    }
+  }
+  /* istanbul ignore next */
+  /**
+   * @inheritDoc
+   */
+  handleDropdownClick() {
+    // No dropdown — single toggle button.
+  }
+  /**
+   * Append an empty paragraph wrapped in a new blockquote to the end of the
+   * content and place the caret inside it.
+   *
+   * @param {VegaRTEContent} content - Editor content to append to.
+   */
+  appendEmptyBlockquote(content) {
+    if (content.children.length > 0) {
+      const lastBlock = content.children[content.children.length - 1];
+      const newBlock = RTETextBlock.from({
+        id: generateUUID(),
+        type: 'paragraph',
+        nodes: [{ id: generateUUID(), type: 'text', text: '' }],
+      });
+      content.apply(new InsertChildrenAfterAction(lastBlock, newBlock));
+      content.apply(new TransformToBlockquoteAction([newBlock]));
+      content.apply(new UpdateCursorPositionAction(newBlock.getLastNode(), 0));
+    }
+  }
+  /**
+   * Wrap the selection's unique parent blocks into a new blockquote. Blocks
+   * inside a list or other nested container escalate to the top-level block.
+   * When the selection spans multiple top-level (root) blocks, any scoped
+   * container touched along the way (e.g. a table cell) is treated as an
+   * opaque block instead of an independent wrap target — the whole
+   * selection wraps as one, and any blockquote nested deeper than the
+   * top-level block (e.g. inside a table cell) is left untouched. Existing
+   * top-level blockquote blocks in the selection are merged (flattened)
+   * into the new one rather than nested.
+   *
+   * @param {RTENode[]} selectedNodes - Currently selected nodes.
+   */
+  wrapSelectedBlocks(selectedNodes) {
+    var _a, _b;
+    const uniqueBlocks = this.getUniqueBlocks(selectedNodes);
+    // If the selection spans more than one top-level block, force every
+    // anchor resolution to escalate all the way to the root, ignoring any
+    // scoped container (e.g. a table cell) it passes through.
+    const rootAncestors = new Set(uniqueBlocks.map((block) => { var _a; return (_a = this.resolveWrapAnchor(block, true).wrapBlock) !== null && _a !== void 0 ? _a : block; }));
+    const forceRootScope = rootAncestors.size > 1;
+    // Pass 1: unwrap any existing blockquote reachable from the selection so it merges instead of nesting.
+    const alreadyUnwrapped = new Set();
+    for (const block of uniqueBlocks) {
+      const { wrapBlock } = this.resolveWrapAnchor(block, forceRootScope);
+      if (wrapBlock instanceof RTEBlockquoteBlock && !alreadyUnwrapped.has(wrapBlock)) {
+        alreadyUnwrapped.add(wrapBlock);
+        wrapBlock.apply(new RemoveBlockquoteAction());
+      }
+    }
+    // Pass 2: group targets by their resolved container so each container is wrapped independently.
+    const containerMap = new Map();
+    for (const block of uniqueBlocks) {
+      const anchor = this.resolveWrapAnchor(block, forceRootScope);
+      const { container } = anchor;
+      if (container) {
+        const target = (_a = anchor.wrapBlock) !== null && _a !== void 0 ? _a : block;
+        const targets = (_b = containerMap.get(container)) !== null && _b !== void 0 ? _b : new Set();
+        targets.add(target);
+        containerMap.set(container, targets);
+      }
+    }
+    for (const [container, targets] of containerMap) {
+      container.apply(new TransformToBlockquoteAction([...targets]));
+    }
+  }
+  /**
+   * Resolve the starting node of the current toolbar selection, if any.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - Render context.
+   * @returns {Nullable<RTENode>} The first selected node, or null.
+   */
+  getStartNode(editorContext) {
+    const context = this.getExtensionContext(editorContext.host);
+    return context === null || context === void 0 ? void 0 : context.getSelectedNodes()[0];
+  }
+  /**
+   * Collect the unique closest blockquote ancestors of every selected node.
+   * Multiple selected nodes that share the same blockquote ancestor collapse
+   * into a single entry, so applying {@link RemoveBlockquoteAction} to each
+   * result unwraps every distinct blockquote in the selection exactly once.
+   *
+   * @param {RTENode[]} nodes - Selected nodes.
+   * @returns {Set<RTEBlockquoteBlock>} Unique blockquote ancestors, preserving insertion order.
+   */
+  collectBlockquoteAncestors(nodes) {
+    const ancestors = new Set();
+    nodes.forEach((node) => {
+      const ancestor = this.findBlockquoteAncestor(node);
+      if (ancestor) {
+        ancestors.add(ancestor);
+      }
+    });
+    return ancestors;
+  }
+  /**
+   * Walk up the block ancestors of the supplied node looking for an
+   * {@link RTEBlockquoteBlock}.
+   *
+   * @param {RTENode} node - Starting node.
+   * @returns {Nullable<RTEBlockquoteBlock>} The closest blockquote ancestor, or null.
+   */
+  findBlockquoteAncestor(node) {
+    let current = node.parent;
+    while (current && !(current instanceof VegaRTEContent)) {
+      if (current instanceof RTEBlockquoteBlock) {
+        return current;
+      }
+      current = current.parent;
+    }
+    return null;
+  }
+  /**
+   * Collect unique block ancestors (immediate parent blocks) from a list of
+   * selected nodes, preserving order of first appearance.
+   *
+   * @param {RTENode[]} nodes - Selected nodes.
+   * @returns {RTEBlock[]} Unique parent blocks.
+   */
+  getUniqueBlocks(nodes) {
+    const seen = new Set();
+    const result = [];
+    nodes.forEach((node) => {
+      const block = node.parent;
+      if (block && !seen.has(block)) {
+        seen.add(block);
+        result.push(block);
+      }
+    });
+    return result;
+  }
+  /**
+   * Walk up from `block` to find the nearest ancestor that is a direct child
+   * of a container registered to handle {@link TRANSFORM_TO_BLOCKQUOTE}
+   * (e.g. {@link VegaRTEContent}, {@link RTETableCellBlock}).
+   *
+   * Stops as soon as the parent can handle the wrap action, so that blocks
+   * inside a table cell are scoped to the cell (not escalated to the root)
+   * while blocks inside a list are still escalated to the top-level list.
+   * Pass `forceRootScope` to ignore scoped containers and always escalate
+   * to the root — used when the overall selection spans multiple top-level
+   * blocks, so a table (or any other scoped container) is wrapped as a
+   * single opaque block alongside its siblings instead of independently.
+   *
+   * @param {RTEBlock} block - Immediate parent block of the selected node.
+   * @param {boolean} [forceRootScope] - Ignore scoped containers and escalate to the root.
+   * @returns {WrapAnchor} `wrapBlock` is the top-level ancestor when the block
+   *   is nested (otherwise null); `container` is the nearest wrap-capable parent.
+   */
+  resolveWrapAnchor(block, forceRootScope = false) {
+    let current = block;
+    while (current.parent &&
+      !(current.parent instanceof VegaRTEContent) &&
+      (forceRootScope ||
+        !ActionHandleStrategyRegistry.canHandle(TRANSFORM_TO_BLOCKQUOTE, current.parent))) {
+      current = current.parent;
+    }
+    const wrapBlock = current !== block ? current : null;
+    const container = current.parent;
+    return { wrapBlock, container };
+  }
+}
+(() => {
+  VegaInternalIconManager.register({ 'quote-left': QuoteLeftIcon });
+})();
+
+/**
+ * Filter styles strategy for blockquote blocks.
+ * Strips default blockquote visual styles during output and refills them during input,
+ * ensuring source edit round-trips do not lose information.
+ */
+class BlockquoteFilterStylesStrategy extends RTEFilterStylesStrategy {
+  constructor() {
+    super(...arguments);
+    this.stylesToBeFiltered = BLOCKQUOTE_DEFAULT_STYLES;
+    this.elementTagName = 'blockquote';
+  }
+  /**
+   * Checks if the given block dto class name corresponds to a blockquote block.
+   *
+   * @param {string} className The class name to check.
+   * @returns {boolean} True if the class name corresponds to a blockquote block, false otherwise.
+   */
+  static isBlockquoteBlock(className) {
+    return className === 'RTEBlockquoteBlock';
+  }
+  /**
+   * @inheritDoc
+   */
+  canFilter(blockOrNodeInstance) {
+    return BlockquoteFilterStylesStrategy.isBlockquoteBlock(blockOrNodeInstance.dtoName);
+  }
+  /**
+   * @inheritDoc
+   */
+  canRefill(_blockOrNodeClassName, element) {
+    return element.tagName.toLowerCase() === this.elementTagName;
+  }
+  /**
+   * @inheritDoc
+   */
+  toCssText() {
+    return this.buildCssTextForStyles(this.elementTagName, this.classNameToBeAdded);
+  }
+}
+
+/**
+ * Adds `<blockquote>` support to the Vega Rich Text Editor.
+ */
+class VegaRTEBlockquoteExtension extends VegaRTEExtension {
+  constructor() {
+    super();
+    this.toolbarButtonRenderer = new RTEBlockquoteToolbarButtonRenderer();
+    this.registerBlockBasicStrategies(RTEBlockquoteBlock.name);
+    this.registerNode('blockquote', RTEBlockquoteBlock);
+    this.registerRenderer('blockquote', RTEBlockquoteBlockRenderer$1);
+    this.registerToolbarButtonRenderer(VegaRTEBlockquoteExtension.TOOLBAR_BUTTON_KEY, this.toolbarButtonRenderer);
+    this.registerElementToBlockDTOClassStrategy(new BlockquoteToBlockquoteBlockStrategy());
+    // Register filter styles strategy for source edit round-trip.
+    VegaRTEExtension.registerFilterStylesStrategy(RTEBlockquoteBlock.dtoName, new BlockquoteFilterStylesStrategy());
+  }
+}
+(() => {
+  const wrapStrategy = new BlockTransformToBlockquoteStrategy();
+  // Root container — wrap top-level blocks.
+  VegaRTEExtension.registerActionHandleStrategy(VegaRTEContent.name, TRANSFORM_TO_BLOCKQUOTE, wrapStrategy);
+  // Table cells (body + header) — wrap is scoped to the closest cell.
+  // Other container blocks (code, list item, function) are intentionally
+  // not registered, so the toolbar stays disabled inside them.
+  VegaRTEExtension.registerActionHandleStrategy(RTETableCellBlock.name, TRANSFORM_TO_BLOCKQUOTE, wrapStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTETableHeadCellBlock.name, TRANSFORM_TO_BLOCKQUOTE, wrapStrategy);
+  VegaRTEExtension.registerActionHandleStrategy(RTEBlockquoteBlock.name, REMOVE_BLOCKQUOTE, new RemoveBlockquoteStrategy());
+  // Enables exiting the blockquote via the keyboard: pressing Enter on an empty
+  // trailing paragraph breaks out to a new paragraph after the blockquote.
+  VegaRTEExtension.registerActionHandlerInterceptor(RTETextBlock.name, ModifyContentActionType.INSERT_NEW_PARAGRAPH, new BlockquoteExitOnEnterInterceptor());
+})();
+VegaRTEBlockquoteExtension.TOOLBAR_BUTTON_KEY = 'blockquote';
 
 const ARROW_CHARACTERS = [
   { character: '←', title: 'leftwards simple arrow' },
@@ -7937,907 +8632,3084 @@ const ARROW_CHARACTERS = [
   { character: '🔝', title: 'top with upwards arrow above' },
 ];
 
-const CURRENCY_CHARACTERS = [
-  { character: '$', title: 'Dollar sign' },
-  { character: '€', title: 'Euro sign' },
-  { character: '¥', title: 'Yen sign' },
-  { character: '£', title: 'Pound sign' },
-  { character: '¢', title: 'Cent sign' },
-  { character: '₠', title: 'Euro-currency sign' },
-  { character: '₡', title: 'Colon sign' },
-  { character: '₢', title: 'Cruzeiro sign' },
-  { character: '₣', title: 'French franc sign' },
-  { character: '₤', title: 'Lira sign' },
-  { character: '¤', title: 'Currency sign' },
-  { character: '₿', title: 'Bitcoin sign' },
-  { character: '₥', title: 'Mill sign' },
-  { character: '₦', title: 'Naira sign' },
-  { character: '₧', title: 'Peseta sign' },
-  { character: '₨', title: 'Rupee sign' },
-  { character: '₩', title: 'Won sign' },
-  { character: '₪', title: 'New sheqel sign' },
-  { character: '₫', title: 'Dong sign' },
-  { character: '₭', title: 'Kip sign' },
-  { character: '₮', title: 'Tugrik sign' },
-  { character: '₯', title: 'Drachma sign' },
-  { character: '₰', title: 'German penny sign' },
-  { character: '₱', title: 'Peso sign' },
-  { character: '₲', title: 'Guarani sign' },
-  { character: '₳', title: 'Austral sign' },
-  { character: '₴', title: 'Hryvnia sign' },
-  { character: '₵', title: 'Cedi sign' },
-  { character: '₶', title: 'Livre tournois sign' },
-  { character: '₷', title: 'Spesmilo sign' },
-  { character: '₸', title: 'Tenge sign' },
-  { character: '₹', title: 'Indian rupee sign' },
-  { character: '₺', title: 'Turkish lira sign' },
-  { character: '₻', title: 'Nordic mark sign' },
-  { character: '₼', title: 'Manat sign' },
-  { character: '₽', title: 'Ruble sign' },
-];
+const CURRENCY_CHARACTERS = [
+  { character: '$', title: 'Dollar sign' },
+  { character: '€', title: 'Euro sign' },
+  { character: '¥', title: 'Yen sign' },
+  { character: '£', title: 'Pound sign' },
+  { character: '¢', title: 'Cent sign' },
+  { character: '₠', title: 'Euro-currency sign' },
+  { character: '₡', title: 'Colon sign' },
+  { character: '₢', title: 'Cruzeiro sign' },
+  { character: '₣', title: 'French franc sign' },
+  { character: '₤', title: 'Lira sign' },
+  { character: '¤', title: 'Currency sign' },
+  { character: '₿', title: 'Bitcoin sign' },
+  { character: '₥', title: 'Mill sign' },
+  { character: '₦', title: 'Naira sign' },
+  { character: '₧', title: 'Peseta sign' },
+  { character: '₨', title: 'Rupee sign' },
+  { character: '₩', title: 'Won sign' },
+  { character: '₪', title: 'New sheqel sign' },
+  { character: '₫', title: 'Dong sign' },
+  { character: '₭', title: 'Kip sign' },
+  { character: '₮', title: 'Tugrik sign' },
+  { character: '₯', title: 'Drachma sign' },
+  { character: '₰', title: 'German penny sign' },
+  { character: '₱', title: 'Peso sign' },
+  { character: '₲', title: 'Guarani sign' },
+  { character: '₳', title: 'Austral sign' },
+  { character: '₴', title: 'Hryvnia sign' },
+  { character: '₵', title: 'Cedi sign' },
+  { character: '₶', title: 'Livre tournois sign' },
+  { character: '₷', title: 'Spesmilo sign' },
+  { character: '₸', title: 'Tenge sign' },
+  { character: '₹', title: 'Indian rupee sign' },
+  { character: '₺', title: 'Turkish lira sign' },
+  { character: '₻', title: 'Nordic mark sign' },
+  { character: '₼', title: 'Manat sign' },
+  { character: '₽', title: 'Ruble sign' },
+];
+
+const LATIN_CHARACTERS = [
+  { character: 'Ā', title: 'Latin capital letter a with macron' },
+  { character: 'ā', title: 'Latin small letter a with macron' },
+  { character: 'Ă', title: 'Latin capital letter a with breve' },
+  { character: 'ă', title: 'Latin small letter a with breve' },
+  { character: 'Ą', title: 'Latin capital letter a with ogonek' },
+  { character: 'ą', title: 'Latin small letter a with ogonek' },
+  { character: 'Ć', title: 'Latin capital letter c with acute' },
+  { character: 'ć', title: 'Latin small letter c with acute' },
+  { character: 'Ĉ', title: 'Latin capital letter c with circumflex' },
+  { character: 'ĉ', title: 'Latin small letter c with circumflex' },
+  { character: 'Ċ', title: 'Latin capital letter c with dot above' },
+  { character: 'ċ', title: 'Latin small letter c with dot above' },
+  { character: 'Č', title: 'Latin capital letter c with caron' },
+  { character: 'č', title: 'Latin small letter c with caron' },
+  { character: 'Ď', title: 'Latin capital letter d with caron' },
+  { character: 'ď', title: 'Latin small letter d with caron' },
+  { character: 'Đ', title: 'Latin capital letter d with stroke' },
+  { character: 'đ', title: 'Latin small letter d with stroke' },
+  { character: 'Ē', title: 'Latin capital letter e with macron' },
+  { character: 'ē', title: 'Latin small letter e with macron' },
+  { character: 'Ĕ', title: 'Latin capital letter e with breve' },
+  { character: 'ĕ', title: 'Latin small letter e with breve' },
+  { character: 'Ė', title: 'Latin capital letter e with dot above' },
+  { character: 'ė', title: 'Latin small letter e with dot above' },
+  { character: 'Ę', title: 'Latin capital letter e with ogonek' },
+  { character: 'ę', title: 'Latin small letter e with ogonek' },
+  { character: 'Ě', title: 'Latin capital letter e with caron' },
+  { character: 'ě', title: 'Latin small letter e with caron' },
+  { character: 'Ĝ', title: 'Latin capital letter g with circumflex' },
+  { character: 'ĝ', title: 'Latin small letter g with circumflex' },
+  { character: 'Ğ', title: 'Latin capital letter g with breve' },
+  { character: 'ğ', title: 'Latin small letter g with breve' },
+  { character: 'Ġ', title: 'Latin capital letter g with dot above' },
+  { character: 'ġ', title: 'Latin small letter g with dot above' },
+  { character: 'Ģ', title: 'Latin capital letter g with cedilla' },
+  { character: 'ģ', title: 'Latin small letter g with cedilla' },
+  { character: 'Ĥ', title: 'Latin capital letter h with circumflex' },
+  { character: 'ĥ', title: 'Latin small letter h with circumflex' },
+  { character: 'Ħ', title: 'Latin capital letter h with stroke' },
+  { character: 'ħ', title: 'Latin small letter h with stroke' },
+  { character: 'Ĩ', title: 'Latin capital letter i with tilde' },
+  { character: 'ĩ', title: 'Latin small letter i with tilde' },
+  { character: 'Ī', title: 'Latin capital letter i with macron' },
+  { character: 'ī', title: 'Latin small letter i with macron' },
+  { character: 'Ĭ', title: 'Latin capital letter i with breve' },
+  { character: 'ĭ', title: 'Latin small letter i with breve' },
+  { character: 'Į', title: 'Latin capital letter i with ogonek' },
+  { character: 'į', title: 'Latin small letter i with ogonek' },
+  { character: 'İ', title: 'Latin capital letter i with dot above' },
+  { character: 'ı', title: 'Latin small letter dotless i' },
+  { character: 'IJ', title: 'Latin capital ligature ij' },
+  { character: 'ij', title: 'Latin small ligature ij' },
+  { character: 'Ĵ', title: 'Latin capital letter j with circumflex' },
+  { character: 'ĵ', title: 'Latin small letter j with circumflex' },
+  { character: 'Ķ', title: 'Latin capital letter k with cedilla' },
+  { character: 'ķ', title: 'Latin small letter k with cedilla' },
+  { character: 'ĸ', title: 'Latin small letter kra' },
+  { character: 'Ĺ', title: 'Latin capital letter l with acute' },
+  { character: 'ĺ', title: 'Latin small letter l with acute' },
+  { character: 'Ļ', title: 'Latin capital letter l with cedilla' },
+  { character: 'ļ', title: 'Latin small letter l with cedilla' },
+  { character: 'Ľ', title: 'Latin capital letter l with caron' },
+  { character: 'ľ', title: 'Latin small letter l with caron' },
+  { character: 'Ŀ', title: 'Latin capital letter l with middle dot' },
+  { character: 'ŀ', title: 'Latin small letter l with middle dot' },
+  { character: 'Ł', title: 'Latin capital letter l with stroke' },
+  { character: 'ł', title: 'Latin small letter l with stroke' },
+  { character: 'Ń', title: 'Latin capital letter n with acute' },
+  { character: 'ń', title: 'Latin small letter n with acute' },
+  { character: 'Ņ', title: 'Latin capital letter n with cedilla' },
+  { character: 'ņ', title: 'Latin small letter n with cedilla' },
+  { character: 'Ň', title: 'Latin capital letter n with caron' },
+  { character: 'ň', title: 'Latin small letter n with caron' },
+  { character: 'ʼn', title: 'Latin small letter n preceded by apostrophe' },
+  { character: 'Ŋ', title: 'Latin capital letter eng' },
+  { character: 'ŋ', title: 'Latin small letter eng' },
+  { character: 'Ō', title: 'Latin capital letter o with macron' },
+  { character: 'ō', title: 'Latin small letter o with macron' },
+  { character: 'Ŏ', title: 'Latin capital letter o with breve' },
+  { character: 'ŏ', title: 'Latin small letter o with breve' },
+  { character: 'Ő', title: 'Latin capital letter o with double acute' },
+  { character: 'ő', title: 'Latin small letter o with double acute' },
+  { character: 'Œ', title: 'Latin capital ligature oe' },
+  { character: 'œ', title: 'Latin small ligature oe' },
+  { character: 'Ŕ', title: 'Latin capital letter r with acute' },
+  { character: 'ŕ', title: 'Latin small letter r with acute' },
+  { character: 'Ŗ', title: 'Latin capital letter r with cedilla' },
+  { character: 'ŗ', title: 'Latin small letter r with cedilla' },
+  { character: 'Ř', title: 'Latin capital letter r with caron' },
+  { character: 'ř', title: 'Latin small letter r with caron' },
+  { character: 'Ś', title: 'Latin capital letter s with acute' },
+  { character: 'ś', title: 'Latin small letter s with acute' },
+  { character: 'Ŝ', title: 'Latin capital letter s with circumflex' },
+  { character: 'ŝ', title: 'Latin small letter s with circumflex' },
+  { character: 'Ş', title: 'Latin capital letter s with cedilla' },
+  { character: 'ş', title: 'Latin small letter s with cedilla' },
+  { character: 'Š', title: 'Latin capital letter s with caron' },
+  { character: 'š', title: 'Latin small letter s with caron' },
+  { character: 'Ţ', title: 'Latin capital letter t with cedilla' },
+  { character: 'ţ', title: 'Latin small letter t with cedilla' },
+  { character: 'Ť', title: 'Latin capital letter t with caron' },
+  { character: 'ť', title: 'Latin small letter t with caron' },
+  { character: 'Ŧ', title: 'Latin capital letter t with stroke' },
+  { character: 'ŧ', title: 'Latin small letter t with stroke' },
+  { character: 'Ũ', title: 'Latin capital letter u with tilde' },
+  { character: 'ũ', title: 'Latin small letter u with tilde' },
+  { character: 'Ū', title: 'Latin capital letter u with macron' },
+  { character: 'ū', title: 'Latin small letter u with macron' },
+  { character: 'Ŭ', title: 'Latin capital letter u with breve' },
+  { character: 'ŭ', title: 'Latin small letter u with breve' },
+  { character: 'Ů', title: 'Latin capital letter u with ring above' },
+  { character: 'ů', title: 'Latin small letter u with ring above' },
+  { character: 'Ű', title: 'Latin capital letter u with double acute' },
+  { character: 'ű', title: 'Latin small letter u with double acute' },
+  { character: 'Ų', title: 'Latin capital letter u with ogonek' },
+  { character: 'ų', title: 'Latin small letter u with ogonek' },
+  { character: 'Ŵ', title: 'Latin capital letter w with circumflex' },
+  { character: 'ŵ', title: 'Latin small letter w with circumflex' },
+  { character: 'Ŷ', title: 'Latin capital letter y with circumflex' },
+  { character: 'ŷ', title: 'Latin small letter y with circumflex' },
+  { character: 'Ÿ', title: 'Latin capital letter y with diaeresis' },
+  { character: 'Ź', title: 'Latin capital letter z with acute' },
+  { character: 'ź', title: 'Latin small letter z with acute' },
+  { character: 'Ż', title: 'Latin capital letter z with dot above' },
+  { character: 'ż', title: 'Latin small letter z with dot above' },
+  { character: 'Ž', title: 'Latin capital letter z with caron' },
+  { character: 'ž', title: 'Latin small letter z with caron' },
+  { character: 'ſ', title: 'Latin small letter long s' },
+];
+
+const MATHEMATICAL_CHARACTERS = [
+  { character: '<', title: 'Less-than sign' },
+  { character: '>', title: 'Greater-than sign' },
+  { character: '≤', title: 'Less-than or equal to' },
+  { character: '≥', title: 'Greater-than or equal to' },
+  { character: '–', title: 'En dash' },
+  { character: '—', title: 'Em dash' },
+  { character: '¯', title: 'Macron' },
+  { character: '‾', title: 'Overline' },
+  { character: '°', title: 'Degree sign' },
+  { character: '−', title: 'Minus sign' },
+  { character: '±', title: 'Plus-minus sign' },
+  { character: '÷', title: 'Division sign' },
+  { character: '⁄', title: 'Fraction slash' },
+  { character: '×', title: 'Multiplication sign' },
+  { character: 'ƒ', title: 'Latin small letter f with hook' },
+  { character: '∫', title: 'Integral' },
+  { character: '∑', title: 'N-ary summation' },
+  { character: '∞', title: 'Infinity' },
+  { character: '√', title: 'Square root' },
+  { character: '∼', title: 'Tilde operator' },
+  { character: '≅', title: 'Approximately equal to' },
+  { character: '≈', title: 'Almost equal to' },
+  { character: '≠', title: 'Not equal to' },
+  { character: '≡', title: 'Identical to' },
+  { character: '∈', title: 'Element of' },
+  { character: '∉', title: 'Not an element of' },
+  { character: '∋', title: 'Contains as member' },
+  { character: '∏', title: 'N-ary product' },
+  { character: '∧', title: 'Logical and' },
+  { character: '∨', title: 'Logical or' },
+  { character: '¬', title: 'Not sign' },
+  { character: '∩', title: 'Intersection' },
+  { character: '∪', title: 'Union' },
+  { character: '∂', title: 'Partial differential' },
+  { character: '∀', title: 'For all' },
+  { character: '∃', title: 'There exists' },
+  { character: '∅', title: 'Empty set' },
+  { character: '∇', title: 'Nabla' },
+  { character: '∗', title: 'Asterisk operator' },
+  { character: '∝', title: 'Proportional to' },
+  { character: '∠', title: 'Angle' },
+  { character: '¼', title: 'Vulgar fraction one quarter' },
+  { character: '½', title: 'Vulgar fraction one half' },
+  { character: '¾', title: 'Vulgar fraction three quarters' },
+];
+
+const TEXT_CHARACTERS = [
+  { character: '‹', title: 'Single left-pointing angle quotation mark' },
+  { character: '›', title: 'Single right-pointing angle quotation mark' },
+  { character: '«', title: 'Left-pointing double angle quotation mark' },
+  { character: '»', title: 'Right-pointing double angle quotation mark' },
+  { character: '‘', title: 'Left single quotation mark' },
+  { character: '’', title: 'Right single quotation mark' },
+  { character: '“', title: 'Left double quotation mark' },
+  { character: '”', title: 'Right double quotation mark' },
+  { character: '‚', title: 'Single low-9 quotation mark' },
+  { character: '„', title: 'Double low-9 quotation mark' },
+  { character: '¡', title: 'Inverted exclamation mark' },
+  { character: '¿', title: 'Inverted question mark' },
+  { character: '‥', title: 'Two dot leader' },
+  { character: '…', title: 'Horizontal ellipsis' },
+  { character: '‡', title: 'Double dagger' },
+  { character: '‰', title: 'Per mille sign' },
+  { character: '‱', title: 'Per ten thousand sign' },
+  { character: '‼', title: 'Double exclamation mark' },
+  { character: '⁈', title: 'Question exclamation mark' },
+  { character: '⁉', title: 'Exclamation question mark' },
+  { character: '⁇', title: 'Double question mark' },
+  { character: '©', title: 'Copyright sign' },
+  { character: '®', title: 'Registered sign' },
+  { character: '™', title: 'Trade mark sign' },
+  { character: '§', title: 'Section sign' },
+  { character: '¶', title: 'Paragraph sign' },
+  { character: '⁋', title: 'Reversed paragraph sign' },
+];
+
+const VegaRTESpecialCharactersLatin = {
+  key: 'latin',
+  label: 'Latin',
+  characters: LATIN_CHARACTERS,
+};
+const VegaRTESpecialCharactersMathematical = {
+  key: 'mathematical',
+  label: 'Mathematical',
+  characters: MATHEMATICAL_CHARACTERS,
+};
+const VegaRTESpecialCharactersArrows = {
+  key: 'arrows',
+  label: 'Arrows',
+  characters: ARROW_CHARACTERS,
+};
+const VegaRTESpecialCharactersCurrency = {
+  key: 'currency',
+  label: 'Currency',
+  characters: CURRENCY_CHARACTERS,
+};
+const VegaRTESpecialCharactersText = {
+  key: 'text',
+  label: 'Text',
+  characters: TEXT_CHARACTERS,
+};
+const VegaRTESpecialCharactersEssentials = [
+  VegaRTESpecialCharactersCurrency,
+  VegaRTESpecialCharactersText,
+  VegaRTESpecialCharactersMathematical,
+  VegaRTESpecialCharactersArrows,
+  VegaRTESpecialCharactersLatin,
+];
+
+const specialCharactersIcon = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M224 80C126.8 80 48 158.8 48 256c0 63.7 33.8 119.5 84.6 150.4c11.4 7 19.4 19.6 19.4 34.2c0 21.8-17.6 39.4-39.4 39.4H24c-13.3 0-24-10.7-24-24s10.7-24 24-24H85.4C33.4 391 0 327.4 0 256C0 132.3 100.3 32 224 32s224 100.3 224 224c0 71.4-33.4 135-85.4 176H424c13.3 0 24 10.7 24 24s-10.7 24-24 24H335.4c-21.8 0-39.4-17.6-39.4-39.4c0-14.6 8-27.2 19.4-34.2C366.2 375.5 400 319.7 400 256c0-97.2-78.8-176-176-176z"/></svg>`,
+};
+
+/**
+ * Toolbar button renderer for the Special Characters extension.
+ * Renders a toolbar button with an Ω icon that opens a popover panel
+ * with categorized character grids.
+ */
+class RTESpecialCharactersToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  constructor(categories) {
+    super();
+    this.panelRef = null;
+    this.categories = categories;
+  }
+  /**
+   * Renders the special characters toolbar button wrapped in a popover.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @returns {VegaRTERenderResult} - The toolbar button render result.
+   */
+  render(h, editorContext) {
+    return h('vega-popover', {
+      trigger: 'click',
+      alignment: 'start',
+      placement: 'bottom',
+      showArrow: false,
+      isScreenPosition: true,
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      ref: (ref) => {
+        if (ref) {
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, () => {
+            this.handlePopoverShow();
+          });
+        }
+      },
+    }, [
+      h('div', { slot: 'popover' }, [
+        h('vega-rich-text-special-characters-panel', {
+          categories: this.categories,
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          ref: (ref) => {
+            if (ref) {
+              this.panelRef = ref;
+              DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, 
+              // eslint-disable-next-line jsdoc/require-jsdoc
+              (payload) => {
+                this.insertCharacter(editorContext, payload.detail);
+              });
+            }
+          },
+        }),
+      ]),
+      h('div', { slot: 'popover-content' }, this.renderButton(h, editorContext, {
+        icon: 'rte-special-characters',
+        tooltip: { text: 'Special Characters' },
+      })),
+    ]);
+  }
+  /**
+   * @inheritDoc
+   */
+  handleButtonClick() {
+    // Popover handles open/close via trigger='click'
+  }
+  /* istanbul ignore next */
+  /**
+   * @inheritDoc
+   */
+  handleDropdownClick() {
+    // No dropdown used
+  }
+  /**
+   * Resets the panel and moves focus to the category select when the
+   * popover opens.
+   */
+  handlePopoverShow() {
+    if (this.panelRef) {
+      void this.panelRef.resetPanel();
+    }
+  }
+  /**
+   * Inserts a special character at the current cursor position using ReplaceSelectedTextAction,
+   * then restores the cursor position after flushing.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @param {string} char - The Unicode character to insert.
+   */
+  insertCharacter(editorContext, char) {
+    const currentRange = editorContext.rteRange;
+    const cursorNode = currentRange.startNode;
+    if (!cursorNode)
+      return;
+    const target = this.isCaretOnLineBreak(cursorNode, currentRange)
+      ? this.insertAtLineBreak(cursorNode, char, currentRange)
+      : this.insertAtTextNode(cursorNode, char, currentRange);
+    editorContext.host.value.apply(new UpdateCursorPositionAction(target.node, target.offset));
+  }
+  /**
+   * Checks whether the caret is collapsed on a Shift+Enter line-break text node.
+   *
+   * @param {RTENode} cursorNode - The current cursor node.
+   * @param {RTERange} range - The current selection range.
+   * @returns {boolean} True if the caret is collapsed on a '\n' text node.
+   */
+  isCaretOnLineBreak(cursorNode, range) {
+    return (cursorNode instanceof RTETextNode &&
+      cursorNode.text === '\n' &&
+      range.startOffset === range.endOffset);
+  }
+  /**
+   * Default insert path: replace the selected range on a regular text node.
+   *
+   * @param {RTENode} cursorNode - The current cursor node.
+   * @param {string} char - The Unicode character to insert.
+   * @param {RTERange} range - The current selection range.
+   * @returns {CaretTarget} The node and offset for the resulting caret position.
+   */
+  insertAtTextNode(cursorNode, char, range) {
+    const action = new ReplaceSelectedTextAction(char, range);
+    action.isFlushable = true;
+    cursorNode.apply(action);
+    // Clamp to node length: empty paragraphs contain a ZWS in the DOM (startOffset=1)
+    // but the DTO text node is empty, so `startOffset + char.length` would overflow.
+    return {
+      node: cursorNode,
+      offset: Math.min(range.startOffset + char.length, cursorNode.getRangeEndOffset()),
+    };
+  }
+  /**
+   * Line-break insert path: delegate to insertTextToLineBreakNode and place
+   * the caret at the end of the inserted text.
+   *
+   * @param {RTETextNode} lineBreakNode - The '\n' text node at the caret.
+   * @param {string} char - The Unicode character to insert.
+   * @param {RTERange} range - The current selection range.
+   * @returns {CaretTarget} Caret target.
+   */
+  insertAtLineBreak(lineBreakNode, char, range) {
+    return {
+      node: this.insertTextToLineBreakNode(lineBreakNode, char, range),
+      offset: char.length,
+    };
+  }
+  /**
+   * Mirror of InsertTextHandler.insertTextToLineBreakNode for the toolbar
+   * insert path: caret on a Shift+Enter line-break text node needs either a
+   * new sibling text node inserted before the break, or the break's text
+   * replaced. The default ReplaceSelectedTextAction + getRangeEndOffset()
+   * path returns 0 for '\n' text nodes and drops the caret in front of the
+   * inserted character.
+   *
+   * @param {RTETextNode} lineBreakNode - The '\n' text node at the caret.
+   * @param {string} text - The text to insert.
+   * @param {RTERange} currentRange - The current selection range.
+   * @returns {RTETextNode} The node the caret should land in.
+   */
+  insertTextToLineBreakNode(lineBreakNode, text, currentRange) {
+    // '\n' text nodes always live inside a text block in the RTE structure.
+    const textBlock = lineBreakNode.parent;
+    const index = textBlock.children.indexOf(lineBreakNode);
+    if (currentRange.startOffset === 0 && textBlock.children[index + 1]) {
+      const newTextNode = lineBreakNode.cloneWithText(text);
+      const insertAction = new InsertChildrenBeforeAction(lineBreakNode, newTextNode);
+      insertAction.isFlushable = true;
+      textBlock.apply(insertAction);
+      return newTextNode;
+    }
+    const updateAction = new UpdateTextAction(text);
+    updateAction.isFlushable = true;
+    lineBreakNode.apply(updateAction);
+    return lineBreakNode;
+  }
+}
+(() => {
+  VegaInternalIconManager.register({ 'rte-special-characters': specialCharactersIcon });
+})();
+
+/**
+ * Vega Rich Text Editor Special Characters Extension.
+ * Adds a toolbar button that opens a popover with categorized Unicode characters
+ * for insertion into the editor content as plain text.
+ */
+class VegaRTESpecialCharactersExtension extends VegaRTEExtension {
+  constructor(config) {
+    super();
+    this.categories = this.buildCategories(config);
+  }
+  /** @inheritDoc */
+  prepareBeforeLoad(host) {
+    this.registerToolbarButtonRenderer(VegaRTESpecialCharactersExtension.TOOLBAR_BUTTON_KEY, new RTESpecialCharactersToolbarButtonRenderer(this.categories), host);
+  }
+  /**
+   * Builds the final list of special character categories from the provided config.
+   *
+   * @param {VegaRTESpecialCharactersConfig} config - Optional configuration with custom categories.
+   * @returns {VegaRTESpecialCharacterCategory[]} - The merged categories array.
+   */
+  buildCategories(config) {
+    const includeDefaults = (config === null || config === void 0 ? void 0 : config.includeDefaults) !== false;
+    const defaultCategories = includeDefaults
+      ? VegaRTESpecialCharactersEssentials
+      : [];
+    if (!(config === null || config === void 0 ? void 0 : config.categories)) {
+      return defaultCategories;
+    }
+    return [...defaultCategories, ...config.categories];
+  }
+}
+VegaRTESpecialCharactersExtension.TOOLBAR_BUTTON_KEY = 'special-characters';
+
+const findReplaceIcon = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2026 Fonticons, Inc. --><path fill="currentColor" d="M208 48c39.6 0 75.9 14.4 103.8 38.2L279 119c-6.9 6.9-8.9 17.2-5.2 26.2S286.3 160 296 160l96 0c13.3 0 24-10.7 24-24l0-96c0-9.7-5.8-18.5-14.8-22.2S381.9 16.2 375 23L345.8 52.2c-36.7-32.5-85-52.2-137.8-52.2-99.4 0-182.4 69.7-203.1 162.8-2.9 12.9 5.3 25.8 18.2 28.6 1.4 .3 2.7 .5 4.1 .5l2.3 0C40.1 191.5 49.4 184 51.8 173.2 67.7 101.6 131.6 48 208 48zM386 224c-10.4 .7-19.4 8.1-21.8 18.8-15.9 71.7-79.8 125.2-156.2 125.2-39.6 0-75.9-14.4-103.8-38.2L137 297c6.9-6.9 8.9-17.2 5.2-26.2S129.7 256 120 256l-96 0c-13.3 0-24 10.7-24 24l0 96c0 9.7 5.8 18.5 14.8 22.2S34.1 399.8 41 393l29.2-29.2c36.7 32.5 85 52.2 137.8 52.2 48.8 0 93.7-16.8 129.1-44.9L471 505c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L371.1 337.1c19.2-24.2 33.1-52.8 40-84 2.9-12.9-5.3-25.8-18.2-28.6-1.2-.3-2.4-.4-3.6-.5l-3.2 0z"/></svg>`,
+};
+
+/**
+ * Defines how a specific type of RTEBlock contributes searchable leaf blocks.
+ *
+ * Implementations are registered on FindReplaceState in priority order.
+ * The first strategy whose `canHandle` returns true is used.
+ */
+class BlockSearchStrategy {
+}
+
+/**
+ * Handles RTECodeBlock — a searchable leaf block whose text lives in children[0].text.
+ */
+class CodeBlockSearchStrategy extends BlockSearchStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(block) {
+    return block instanceof RTECodeBlock;
+  }
+  /**
+   * @inheritDoc
+   */
+  collect(block) {
+    return [block];
+  }
+}
+
+/**
+ * Handles RTEListItemBlock — a searchable leaf block that may also carry
+ * nested RTEListBlocks via its `nestList` property.
+ *
+ * Must be registered before TextBlockSearchStrategy because RTEListItemBlock
+ * extends RTETextBlock and would otherwise be matched by the parent class check.
+ */
+class ListItemBlockSearchStrategy extends BlockSearchStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(block) {
+    return block instanceof RTEListItemBlock;
+  }
+  /**
+   * @inheritDoc
+   */
+  collect(block, recurse) {
+    const listItemBlock = block;
+    const result = [listItemBlock];
+    if (listItemBlock.nestList && listItemBlock.nestList.length > 0) {
+      for (const nestedList of listItemBlock.nestList) {
+        result.push(...recurse(nestedList.children));
+      }
+    }
+    return result;
+  }
+}
+
+/**
+ * Handles plain RTETextBlock (paragraph, heading, etc.) — a searchable leaf
+ * block whose text lives in its RTETextNode children.
+ */
+class TextBlockSearchStrategy extends BlockSearchStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(block) {
+    return block instanceof RTETextBlock;
+  }
+  /**
+   * @inheritDoc
+   */
+  collect(block) {
+    return [block];
+  }
+}
+
+/**
+ * Fallback strategy for generic container blocks whose concrete type is not
+ * known at compile time (RTEHtmlBlock, table blocks, extension-defined blocks, …).
+ *
+ * A block is treated as a container when its children array is non-empty and
+ * the first child is not an RTETextNode (i.e. children are blocks, not nodes).
+ */
+class ContainerBlockSearchStrategy extends BlockSearchStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(block) {
+    return (block.children != null && block.children.length > 0 && !(block.children[0] instanceof RTETextNode));
+  }
+  /**
+   * @inheritDoc
+   */
+  collect(block, recurse) {
+    return recurse(block.children);
+  }
+}
+
+/**
+ * Sentinel character inserted into the flat text in place of a non-editable
+ * node (e.g. a token). It keeps surrounding searchable segments from bridging
+ * across the removed node — producing false matches — while never matching any
+ * user keyword. `\u0000` (NULL) does not appear in editable document text.
+ */
+const NON_EDITABLE_SENTINEL = '\u0000';
+/**
+ * Manages the in-memory state for a single Find & Replace session.
+ *
+ * One instance is created per editor host inside VegaRTEFindReplaceExtension
+ * during `initialExtensionAfterLoad`. It holds all search results, the
+ * current navigation index, and a per-block flat-text cache.
+ *
+ * Public API:
+ * - `search(content, keyword)` — run a search, replace current state using current options
+ * - `next()` / `prev()` — navigate through results
+ * - `getCurrentMatch()` / `getMatches()` / `getTotal()` / `getCurrentIndex()` — read state
+ * - `clear()` — reset everything
+ */
+class FindReplaceState {
+  constructor() {
+    this.matches = [];
+    this.currentIndex = -1;
+    this.flatCache = new WeakMap();
+    this.cachedContent = null;
+    this.matchCase = false;
+    this.wholeWords = false;
+    /**
+     * Ordered strategy chain used to classify and traverse each block type.
+     * More specific types (RTEListItemBlock) must precede their parent class (RTETextBlock).
+     */
+    this.blockSearchStrategies = [
+      new CodeBlockSearchStrategy(),
+      new ListItemBlockSearchStrategy(),
+      new TextBlockSearchStrategy(),
+      new ContainerBlockSearchStrategy(),
+    ];
+  }
+  /**
+   * Runs a fresh search over the given content and replaces all previous results.
+   *
+   * The flat-text cache is invalidated whenever the content reference changes
+   * (i.e. after the user edits the document). When only the keyword or options
+   * change (user typing in the find input), the cache is reused.
+   *
+   * @param {VegaRTEContent} content - The root content DTO to search.
+   * @param {string} keyword - The search keyword entered by the user.
+   * Uses the currently stored `matchCase` and `wholeWords` options.
+   */
+  search(content, keyword) {
+    this.invalidateCacheIfNeeded(content);
+    if (!keyword) {
+      this.matches = [];
+      this.currentIndex = -1;
+      return;
+    }
+    const regex = this.buildRegExp(keyword, this.getFindOptions());
+    const blocks = this.collectSearchableBlocks(content.children);
+    const results = [];
+    for (const block of blocks) {
+      let cached = this.flatCache.get(block);
+      if (!cached) {
+        cached =
+          block instanceof RTECodeBlock
+            ? this.buildCodeBlockFlat(block)
+            : this.buildTextBlockFlat(block);
+        this.flatCache.set(block, cached);
+      }
+      const { flatText, segments } = cached;
+      if (!flatText) {
+        continue;
+      }
+      regex.lastIndex = 0;
+      let match;
+      while ((match = regex.exec(flatText)) !== null) {
+        // match[1] is always the keyword capture group. In wholeWords mode,
+        // match[0] may include a leading non-letter boundary char, so we
+        // compute the actual start from the end offset minus the keyword length.
+        const matchEnd = match.index + match[0].length;
+        const matchStart = matchEnd - match[1].length;
+        const nodes = this.flatOffsetToNodePositions(segments, matchStart, matchEnd);
+        if (nodes.length > 0) {
+          results.push({ block, nodes, matchText: match[1] });
+        }
+      }
+    }
+    this.matches = results;
+    this.currentIndex = results.length > 0 ? 0 : -1;
+  }
+  /**
+   * Advances to the next match, wrapping around to the first.
+   */
+  next() {
+    if (this.matches.length === 0) {
+      return;
+    }
+    this.currentIndex = (this.currentIndex + 1) % this.matches.length;
+  }
+  /**
+   * Moves to the previous match, wrapping around to the last.
+   */
+  prev() {
+    if (this.matches.length === 0) {
+      return;
+    }
+    this.currentIndex = (this.currentIndex - 1 + this.matches.length) % this.matches.length;
+  }
+  /**
+   * Sets the current index directly. Clamps to valid range.
+   *
+   * @param {number} index - The desired index.
+   */
+  setCurrentIndex(index) {
+    if (this.matches.length === 0) {
+      this.currentIndex = -1;
+      return;
+    }
+    this.currentIndex = Math.max(0, Math.min(index, this.matches.length - 1));
+  }
+  /**
+   * Returns the currently active match, or null if there are no results.
+   *
+   * @returns {FindMatch | null} The currently active match, or null if there are no results.
+   */
+  getCurrentMatch() {
+    var _a;
+    return (_a = this.matches[this.currentIndex]) !== null && _a !== void 0 ? _a : null;
+  }
+  /**
+   * Returns all matches from the last search.
+   *
+   * @returns {ReadonlyArray<FindMatch>} All matches from the last search.
+   */
+  getMatches() {
+    return this.matches;
+  }
+  /**
+   * Returns the total number of matches from the last search.
+   *
+   * @returns {number} The total number of matches.
+   */
+  getTotal() {
+    return this.matches.length;
+  }
+  /**
+   * Returns the 0-based index of the current match, or -1 when there are no results.
+   *
+   * @returns {number} The 0-based index, or -1 when there are no results.
+   */
+  getCurrentIndex() {
+    return this.currentIndex;
+  }
+  /**
+   * Resets only match results and navigation index.
+   * The flat-text cache and cached content reference are preserved so that
+   * a subsequent search on the same document (e.g. after a keyword change)
+   * can reuse the already-computed block flat texts.
+   */
+  clearResults() {
+    this.matches = [];
+    this.currentIndex = -1;
+  }
+  /**
+   * Resets all search state, including results, navigation index, and flat-text cache.
+   * Use this when the session ends (e.g. panel closed) or the host changes.
+   */
+  clear() {
+    this.matches = [];
+    this.currentIndex = -1;
+    this.flatCache = new WeakMap();
+    this.cachedContent = null;
+  }
+  /**
+   * Sets the matchCase search option.
+   *
+   * @param {boolean} enabled - Whether to enable case-sensitive matching.
+   */
+  setMatchCase(enabled) {
+    this.matchCase = enabled;
+  }
+  /**
+   * Sets the wholeWords search option.
+   *
+   * @param {boolean} enabled - Whether to enable whole-word matching.
+   */
+  setWholeWords(enabled) {
+    this.wholeWords = enabled;
+  }
+  // ─── Private helpers ──────────────────────────────────────────────────────────
+  /**
+   * Invalidates the flat-text cache when the content reference has changed.
+   * Since flushChanges always produces a new VegaRTEContent via clone(), a
+   * changed reference reliably indicates the document has been edited.
+   *
+   * @param {VegaRTEContent} content - The incoming content reference.
+   */
+  invalidateCacheIfNeeded(content) {
+    if (content !== this.cachedContent) {
+      this.flatCache = new WeakMap();
+      this.cachedContent = content;
+    }
+  }
+  /**
+   * Builds a RegExp from the keyword and search options.
+   *
+   * @param {string} keyword - The raw user input.
+   * @param {FindOptions} options - Search options.
+   * @returns {RegExp} The compiled regular expression.
+   */
+  buildRegExp(keyword, options) {
+    const escaped = this.escapeRegExp(keyword);
+    // eslint-disable-next-line spellcheck/spell-checker
+    let flags = 'gu';
+    if (!options.matchCase) {
+      flags += 'i';
+    }
+    if (options.wholeWords) {
+      // Aligned with CKEditor's findByTextCallback non-letter boundary group.
+      //
+      // The keyword is wrapped in a capturing group (match[1]) so the search
+      // loop can compute the exact start offset without lookbehind assertions
+      // (not supported in Safari < 16.4). The non-capturing prefix group
+      // `(?:^|nonLetter)` may consume one boundary char, which is why we
+      // derive matchStart as matchEnd - match[1].length rather than match.index.
+      const nonLetter = '[^a-zA-Z\u00C0-\u024F\u1E00-\u1EFF]';
+      const prefix = !new RegExp(`^${nonLetter}`).test(keyword) ? `(?:^|${nonLetter})` : '';
+      const suffix = !new RegExp(`${nonLetter}$`).test(keyword) ? `(?=${nonLetter}|$)` : '';
+      return new RegExp(`${prefix}(${escaped})${suffix}`, flags);
+    }
+    return new RegExp(`(${escaped})`, flags);
+  }
+  /**
+   * Escapes all regex special characters so the keyword is treated as literal text.
+   *
+   * @param {string} text - The raw input string.
+   * @returns {string} The escaped string safe for use in a RegExp constructor.
+   */
+  escapeRegExp(text) {
+    return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  }
+  /**
+   * Recursively collects all searchable leaf blocks (RTETextBlock and RTECodeBlock)
+   * from a block tree in document order.
+   *
+   * Each block is dispatched to the first matching BlockSearchStrategy.
+   *
+   * @param {RTEBlock[]} blocks - The block array to traverse.
+   * @returns {(RTETextBlock | RTECodeBlock)[]} Ordered list of searchable leaf blocks.
+   */
+  collectSearchableBlocks(blocks) {
+    const result = [];
+    const recurse = this.collectSearchableBlocks.bind(this);
+    for (const block of blocks) {
+      const strategy = this.blockSearchStrategies.find((s) => s.canHandle(block));
+      if (strategy) {
+        result.push(...strategy.collect(block, recurse));
+      }
+    }
+    return result;
+  }
+  /**
+   * Builds the flat text and segment table for a RTETextBlock.
+   *
+   * Non-editable child nodes (e.g. tokens, which render as read-only chips)
+   * are excluded from the searchable flat text. Each is replaced by a single
+   * sentinel character so that adjacent editable segments cannot bridge across
+   * the token to form a false match, while keeping segment offsets aligned.
+   *
+   * @param {RTETextBlock} block - The text block to flatten.
+   * @returns {BlockFlatCache} The flat text string and segment mapping.
+   */
+  buildTextBlockFlat(block) {
+    const segments = [];
+    const flatParts = [];
+    let cursor = 0;
+    for (const node of block.children) {
+      if (!node.isContentEditable()) {
+        flatParts.push(NON_EDITABLE_SENTINEL);
+        cursor += NON_EDITABLE_SENTINEL.length;
+        continue;
+      }
+      const len = node.text.length;
+      segments.push({ node, start: cursor, end: cursor + len });
+      flatParts.push(node.text);
+      cursor += len;
+    }
+    return {
+      flatText: flatParts.join(''),
+      segments,
+    };
+  }
+  /**
+   * Builds the flat text and segment table for a RTECodeBlock.
+   *
+   * @param {RTECodeBlock} block - The code block to flatten.
+   * @returns {BlockFlatCache} The flat text string and segment mapping.
+   */
+  buildCodeBlockFlat(block) {
+    const codeNode = block.children[0];
+    if (!codeNode) {
+      return { flatText: '', segments: [] };
+    }
+    const flatText = codeNode.text;
+    return {
+      flatText,
+      segments: [{ node: codeNode, start: 0, end: flatText.length }],
+    };
+  }
+  /**
+   * Maps a flat [matchStart, matchEnd) range back to individual node positions.
+   *
+   * @param {(TextSegment | CodeSegment)[]} segments - The segment table.
+   * @param {number} matchStart - Inclusive start in the flat text.
+   * @param {number} matchEnd - Exclusive end in the flat text.
+   * @returns {NodePosition[]} Ordered list of node-local positions spanning the match.
+   */
+  flatOffsetToNodePositions(segments, matchStart, matchEnd) {
+    const positions = [];
+    for (const segment of segments) {
+      if (segment.end <= matchStart) {
+        continue;
+      }
+      if (segment.start >= matchEnd) {
+        break;
+      }
+      const localStart = Math.max(0, matchStart - segment.start);
+      const localEnd = Math.min(segment.end, matchEnd) - segment.start;
+      positions.push({ node: segment.node, startOffset: localStart, endOffset: localEnd });
+    }
+    return positions;
+  }
+  /**
+   * Builds the current find options from the shared context.
+   *
+   * @returns {FindOptions} The options for the search engine.
+   */
+  getFindOptions() {
+    return { matchCase: this.matchCase, wholeWords: this.wholeWords };
+  }
+}
+
+// Light-mode values (used as CSS var() fall-backs).
+// Dark-mode values are registered via VegaDarkModeStyleController below.
+const HIGHLIGHT_BG_LIGHT = '255, 220, 0, 0.35';
+const HIGHLIGHT_ACTIVE_BG_LIGHT = '255, 150, 0, 0.5';
+// Dark-mode: brighter yellow/orange tones stand out on dark backgrounds.
+const HIGHLIGHT_BG_DARK = '255, 235, 0, 0.55';
+const HIGHLIGHT_ACTIVE_BG_DARK = '255, 190, 0, 0.7';
+// CSS var() expressions that auto-switch between light and dark.
+const HIGHLIGHT_BG = `rgba(var(--v-rte-find-highlight-bg, ${HIGHLIGHT_BG_LIGHT}))`;
+const HIGHLIGHT_ACTIVE_BG = `rgba(var(--v-rte-find-highlight-active-bg, ${HIGHLIGHT_ACTIVE_BG_LIGHT}))`;
+/**
+ * Manages highlights for the Find & Replace extension using a DOM overlay.
+ *
+ * Instead of modifying the RTE content tree (which causes re-renders, cursor
+ * jumping, and VegaChange events), this manager renders semi-transparent
+ * highlight rectangles in an absolutely-positioned overlay container.
+ *
+ * The overlay lives inside `.rich-text-editor-container` (the RTE's scroll
+ * container) so highlight divs scroll naturally with the text content.
+ * `pointer-events: none` ensures highlights don't interfere with user
+ * interaction (selection, typing, clicking).
+ *
+ * Position computation uses `Range.getClientRects()` on the actual text DOM
+ * nodes (resolved via `stateEntityRenderingRegistry.getDOMByEntity`).
+ */
+class FindReplaceHighlightManager {
+  constructor() {
+    this.overlayContainer = null;
+    // Register dark-mode overrides so `html.dark { --v-rte-find-highlight-*: ... }` is generated.
+    // CSS variables cascade into shadow DOM and update automatically when html.dark is toggled.
+    VegaDarkModeStyleController.registerCustomDarkModeColor({
+      'rte-find-highlight-bg': HIGHLIGHT_BG_DARK,
+      'rte-find-highlight-active-bg': HIGHLIGHT_ACTIVE_BG_DARK,
+      'rte-find-highlight-blend': 'lighten',
+    });
+  }
+  /**
+   * Renders highlight overlays for all matches, with the active match
+   * visually distinct. Clears any existing highlights before applying.
+   *
+   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
+   * @param {ReadonlyArray<FindMatch>} matches - All search results.
+   * @param {number} currentIndex - 0-based index of the active match (-1 = none).
+   * @param {HTMLVegaRichTextEditorElement} host - The RTE host element.
+   * @param {boolean} scrollToActive - Whether to scroll the active highlight into view.
+   */
+  apply(matches, currentIndex, host, scrollToActive = true) {
+    this.clear();
+    if (matches.length === 0) {
+      return;
+    }
+    const overlay = this.getOrCreateOverlay(host);
+    if (overlay) {
+      const overlayRect = overlay.getBoundingClientRect();
+      let activeHighlightDiv = null;
+      matches.forEach((match, matchIndex) => {
+        const isActive = matchIndex === currentIndex;
+        const bg = isActive ? HIGHLIGHT_ACTIVE_BG : HIGHLIGHT_BG;
+        match.nodes.forEach((nodePosition) => {
+          const highlightDiv = this.createHighlightRectangles(overlay, overlayRect, nodePosition, bg);
+          if (isActive && !activeHighlightDiv && highlightDiv) {
+            activeHighlightDiv = highlightDiv;
+          }
+        });
+      });
+      if (scrollToActive && activeHighlightDiv) {
+        activeHighlightDiv.scrollIntoView({ block: 'center', inline: 'nearest' });
+      }
+    }
+  }
+  /**
+   * Removes all highlight overlay elements.
+   * Safe to call multiple times or when no highlights are active.
+   */
+  clear() {
+    if (this.overlayContainer) {
+      this.overlayContainer.innerHTML = '';
+    }
+  }
+  // ─── Private helpers ──────────────────────────────────────────────────────────
+  /**
+   * Gets the existing overlay container or creates one inside the RTE's
+   * scroll container (`.rich-text-editor-container`).
+   *
+   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
+   * @param {HTMLVegaRichTextEditorElement} host - The RTE host element.
+   * @returns {HTMLDivElement | null} The overlay container, or null in SSR environments.
+   */
+  getOrCreateOverlay(host) {
+    if (this.overlayContainer && this.overlayContainer.isConnected) {
+      return this.overlayContainer;
+    }
+    const safeDocument = tryGetDocument();
+    if (safeDocument) {
+      const scrollContainer = host.shadowRoot.querySelector('.rich-text-editor-container');
+      if (scrollContainer) {
+        // The overlay is appended as the last child (paints above content).
+        // Blend mode is controlled via CSS variable --v-rte-find-highlight-blend:
+        //   - Light (default): multiply (yellow darkens white bg, text readable)
+        //   - Dark (via html.dark override): lighten (yellow visible on dark bg,
+        //     white text unaffected since lighten(255, x) = 255)
+        // CSS vars cascade into shadow DOM and react to theme switches instantly.
+        const overlay = safeDocument.createElement('div');
+        overlay.style.position = 'absolute';
+        overlay.style.top = '0';
+        overlay.style.left = '0';
+        overlay.style.width = '100%';
+        overlay.style.height = '100%';
+        overlay.style.pointerEvents = 'none';
+        overlay.style.overflow = 'visible';
+        overlay.style.setProperty('mix-blend-mode', 'var(--v-rte-find-highlight-blend, multiply)');
+        scrollContainer.appendChild(overlay);
+        this.overlayContainer = overlay;
+        return overlay;
+      }
+    }
+    return null;
+  }
+  /**
+   * Creates absolutely-positioned highlight rectangles for a single node
+   * position within a match.
+   *
+   * Uses client rectangle extraction from `Range` to handle multi-line matches (where a
+   * single text range may produce multiple rectangles due to line wrapping).
+   *
+   * @param {HTMLDivElement} overlay - The overlay container.
+   * @param {DOMRect} overlayRect - The overlay's bounding client rect (for coordinate conversion).
+   * @param {NodePosition} nodePosition - The node and character offsets for this segment.
+   * @param {string} bg - The background color to apply.
+   * @returns {Nullable<HTMLDivElement>} The first created highlight div for this node segment.
+   */
+  createHighlightRectangles(overlay, overlayRect, nodePosition, bg) {
+    const domElement = stateEntityRenderingRegistry.getDOMByEntity(nodePosition.node);
+    if (!domElement) {
+      return null;
+    }
+    const range = this.buildRange(domElement, nodePosition);
+    if (!range) {
+      return null;
+    }
+    // eslint-disable-next-line spellcheck/spell-checker -- DOM API method name is fixed by platform.
+    const clientRectList = range.getClientRects();
+    const safeDocument = tryGetDocument();
+    let firstHighlightDiv = null;
+    if (safeDocument) {
+      for (let i = 0; i < clientRectList.length; i++) {
+        const rect = clientRectList[i];
+        if (rect.width === 0 || rect.height === 0) {
+          continue;
+        }
+        const div = safeDocument.createElement('div');
+        div.style.position = 'absolute';
+        div.style.top = `${rect.top - overlayRect.top}px`;
+        div.style.left = `${rect.left - overlayRect.left}px`;
+        div.style.width = `${rect.width}px`;
+        div.style.height = `${rect.height}px`;
+        div.style.backgroundColor = bg;
+        div.style.pointerEvents = 'none';
+        div.style.borderRadius = '2px';
+        overlay.appendChild(div);
+        if (!firstHighlightDiv) {
+          firstHighlightDiv = div;
+        }
+      }
+    }
+    return firstHighlightDiv;
+  }
+  /**
+   * Builds a DOM Range for the given node position.
+   *
+   * For standard text nodes (RTETextNode rendered as `<span>`), the first
+   * child is a Text node and offsets apply directly.
+   *
+   * For code block nodes (`<vega-code-block>` with shadow DOM), we traverse
+   * the shadow root's `<code>` element child spans to locate the correct
+   * text positions by accumulated character offset.
+   *
+   * @param {HTMLElement} domElement - The registered DOM element for the node.
+   * @param {NodePosition} nodePosition - The character offsets within the node.
+   * @returns {Nullable<Range>} A Range if successfully built, or null on failure.
+   */
+  buildRange(domElement, nodePosition) {
+    // <vega-code-block> wraps syntax-highlighted tokens inside a shadow root <code> element.
+    if (nodePosition.node instanceof RTECodeBlockNode) {
+      return this.buildCodeBlockRange(domElement, nodePosition);
+    }
+    // Standard text node: <span> with a direct Text child.
+    const textNode = domElement.firstChild;
+    if (!textNode) {
+      return null;
+    }
+    const safeDocument = tryGetDocument();
+    if (safeDocument) {
+      const range = safeDocument.createRange();
+      try {
+        range.setStart(textNode, nodePosition.startOffset);
+        range.setEnd(textNode, nodePosition.endOffset);
+        return range;
+      }
+      catch (_a) {
+        return null;
+      }
+    }
+    return null;
+  }
+  /**
+   * Builds a Range inside a `<vega-code-block>` shadow DOM element.
+   *
+   * `<vega-code-block>` renders its content inside a shadow root with a `<code>`
+   * element containing multiple child `<span>` nodes (one per syntax token).
+   * This method walks all Text nodes within that `<code>` element, accumulating
+   * character length until the positions corresponding to startOffset / endOffset
+   * are found.
+   *
+   * @param {HTMLElement} domElement - The `<vega-code-block>` host element.
+   * @param {NodePosition} nodePosition - The character offsets within the node.
+   * @returns {Range | null} A Range if successfully built, or null on failure.
+   */
+  buildCodeBlockRange(domElement, nodePosition) {
+    const shadowRoot = domElement.shadowRoot;
+    const codeEl = shadowRoot.querySelector('code');
+    if (!codeEl) {
+      return null;
+    }
+    const safeDocument = tryGetDocument();
+    if (safeDocument) {
+      const walker = safeDocument.createTreeWalker(codeEl, NodeFilter.SHOW_TEXT);
+      let accumulated = 0;
+      let startNode = null;
+      let startLocal = 0;
+      let endNode = null;
+      let endLocal = 0;
+      let current = walker.nextNode();
+      while (current) {
+        const len = current.textContent.length;
+        if (!startNode && accumulated + len > nodePosition.startOffset) {
+          startNode = current;
+          startLocal = nodePosition.startOffset - accumulated;
+        }
+        if (accumulated + len >= nodePosition.endOffset) {
+          endNode = current;
+          endLocal = nodePosition.endOffset - accumulated;
+          break;
+        }
+        accumulated += len;
+        current = walker.nextNode();
+      }
+      if (startNode && endNode) {
+        const range = safeDocument.createRange();
+        try {
+          range.setStart(startNode, startLocal);
+          range.setEnd(endNode, endLocal);
+          return range;
+        }
+        catch (_a) {
+          return null;
+        }
+      }
+    }
+    return null;
+  }
+}
+
+/**
+ * Creates a new shared controller context with default (empty) state.
+ *
+ * @returns {FindReplaceControllerContext} A fresh context instance.
+ */
+function createFindReplaceControllerContext() {
+  return {
+    state: new FindReplaceState(),
+    highlightManager: new FindReplaceHighlightManager(),
+    hostRef: null,
+    keyword: '',
+  };
+}
+/**
+ * Abstract base controller for the Find & Replace extension.
+ *
+ * Holds shared operations ({@link setHost}, {@link setKeyword}) and the
+ * common helper {@link applyAndGetResult}. Concrete implementations
+ * ({@link FindController}, {@link ReplaceController}) add the respective
+ * search/navigation and mutation capabilities.
+ */
+class FindReplaceControllerAbstract {
+  constructor(context) {
+    this.context = context;
+  }
+  /**
+   * Updates the cached host reference. Called on each render cycle.
+   *
+   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
+   * @param {HTMLVegaRichTextEditorElement} host - The RTE host element.
+   */
+  setHost(host) {
+    this.context.hostRef = host;
+  }
+  /**
+   * Updates the keyword. Clears previous match results and highlights,
+   * but preserves the flat-text cache so the next find() on the same
+   * document does not re-flatten every block.
+   *
+   * @param {string} keyword - The new search keyword.
+   * @returns {FindReplaceResult} Reset result (0/0).
+   */
+  setKeyword(keyword) {
+    this.context.keyword = keyword;
+    this.context.state.clearResults();
+    if (this.context.hostRef) {
+      this.context.highlightManager.clear();
+    }
+    return { current: 0, total: 0 };
+  }
+  // ─── Protected ────────────────────────────────────────────────────────────────
+  /**
+   * Applies highlight overlays and returns the current result for the panel.
+   *
+   * @param {boolean} scrollToActive - Whether to scroll the active highlight into view.
+   * @returns {FindReplaceResult} The current match position and total count.
+   */
+  applyAndGetResult(scrollToActive = true) {
+    const total = this.context.state.getTotal();
+    const current = total > 0 ? this.context.state.getCurrentIndex() + 1 : 0;
+    if (this.context.hostRef) {
+      this.context.highlightManager.apply(this.context.state.getMatches(), this.context.state.getCurrentIndex(), this.context.hostRef, scrollToActive);
+    }
+    return { current, total };
+  }
+}
+
+/**
+ * Concrete find controller.
+ *
+ * Provides search, navigation, highlight, and lifecycle capabilities.
+ * Shares state with {@link ReplaceController} via the injected
+ * {@link FindReplaceControllerContext}.
+ */
+class FindController extends FindReplaceControllerAbstract {
+  constructor(context) {
+    super(context);
+  }
+  /**
+   * Runs a search with the current keyword on the host's content.
+   * Applies highlights and returns the result for panel display.
+   *
+   * @returns {FindReplaceResult} The match count and current position.
+   */
+  find() {
+    if (!this.context.hostRef) {
+      return { current: 0, total: 0 };
+    }
+    this.context.state.search(this.context.hostRef.value, this.context.keyword);
+    return this.applyAndGetResult();
+  }
+  /**
+   * Navigates to the next match.
+   *
+   * @returns {FindReplaceResult} Updated position.
+   */
+  next() {
+    this.context.state.next();
+    return this.applyAndGetResult();
+  }
+  /**
+   * Navigates to the previous match.
+   *
+   * @returns {FindReplaceResult} Updated position.
+   */
+  prev() {
+    this.context.state.prev();
+    return this.applyAndGetResult();
+  }
+  /**
+   * Clears all search state and removes highlight overlays.
+   */
+  clear() {
+    this.context.state.clear();
+    if (this.context.hostRef) {
+      this.context.highlightManager.clear();
+    }
+  }
+  /**
+   * Re-runs the search after content has changed (e.g. user typed while
+   * panel is open). Attempts to preserve the previous navigation position.
+   *
+   * @param {boolean} scrollToActive - Whether to scroll the active highlight into view.
+   * @returns {FindReplaceResult | null} Updated result, or null if no search is active.
+   */
+  refresh(scrollToActive = true) {
+    if (!this.context.keyword || !this.context.hostRef) {
+      return null;
+    }
+    const prevIndex = this.context.state.getCurrentIndex();
+    this.context.state.search(this.context.hostRef.value, this.context.keyword);
+    this.context.state.setCurrentIndex(prevIndex);
+    return this.applyAndGetResult(scrollToActive);
+  }
+  /**
+   * Toggles the match-case search option, clears previous results,
+   * and re-runs the search if a keyword is set.
+   *
+   * @param {boolean} enabled - Whether match-case should be enabled.
+   * @returns {FindReplaceResult} The updated search result.
+   */
+  setMatchCase(enabled) {
+    this.context.state.setMatchCase(enabled);
+    return this.updateFindResults();
+  }
+  /**
+   * Toggles the whole-words search option, clears previous results,
+   * and re-runs the search if a keyword is set.
+   *
+   * @param {boolean} enabled - Whether whole-words should be enabled.
+   * @returns {FindReplaceResult} The updated search result.
+   */
+  setWholeWords(enabled) {
+    this.context.state.setWholeWords(enabled);
+    return this.updateFindResults();
+  }
+  // ─── Private helpers ──────────────────────────────────────────────────────────
+  /**
+   * Clears previous results and re-runs the search with the current keyword and options.
+   *
+   * @returns {FindReplaceResult} The updated search result.
+   */
+  updateFindResults() {
+    this.context.state.clearResults();
+    if (this.context.keyword && this.context.hostRef) {
+      this.context.state.search(this.context.hostRef.value, this.context.keyword);
+      return this.applyAndGetResult();
+    }
+    return { current: 0, total: 0 };
+  }
+}
+
+/**
+ * Replace controller — adds mutation capabilities on top of the shared
+ * find state.
+ *
+ * Shares state with {@link FindController} via the injected
+ * {@link FindReplaceControllerContext}, so both controllers always operate
+ * on the same search results and highlight overlays.
+ */
+class ReplaceController extends FindReplaceControllerAbstract {
+  constructor(context) {
+    super(context);
+    /** The replacement string used by replace() and replaceAll(). Updated via setReplacement(). */
+    this.replacement = '';
+    this.flushFn = null;
+  }
+  /**
+   * Stores the flush callback used to commit content changes to the editor.
+   * Called by the toolbar renderer after obtaining it from the extension context.
+   *
+   * Calling `flushValue` once — even after mutating multiple nodes — creates a
+   * single entry in the editor's undo stack, so the entire replace/replaceAll
+   * operation is undone as one atomic step.
+   *
+   * @param {(value: VegaRTEContent) => void} fn - The flush function.
+   * @returns {void} No return value.
+   */
+  setFlushValue(fn) {
+    this.flushFn = fn;
+  }
+  /**
+   * Stores the replacement text for the next replace() or replaceAll() call.
+   *
+   * @param {string} text - The replacement string.
+   * @returns {void} No return value.
+   */
+  setReplacement(text) {
+    this.replacement = text;
+  }
+  /**
+   * Replaces the current match with the stored replacement text,
+   * advances to the next match, and refreshes highlights.
+   * An empty replacement string deletes the matched text.
+   *
+   * No-op when there is no current match or no host.
+   *
+   * @returns {FindReplaceResult} Updated match position and total.
+   */
+  replace() {
+    const currentMatch = this.context.state.getCurrentMatch();
+    if (currentMatch && this.context.hostRef && this.flushFn) {
+      const previousIndex = this.context.state.getCurrentIndex();
+      this.applyMatchReplacement(currentMatch);
+      this.flushFn(this.context.hostRef.value);
+      this.context.state.clear();
+      this.context.state.search(this.context.hostRef.value, this.context.keyword);
+      // setCurrentIndex clamps to [0, total-1], so passing previousIndex
+      // directly keeps the cursor as close as possible to the replaced position
+      // rather than wrapping around when previousIndex >= total.
+      this.context.state.setCurrentIndex(previousIndex);
+    }
+    return this.applyAndGetResult();
+  }
+  /**
+   * Replaces all matches with the stored replacement text in a single operation
+   * (one flushValue call = one Undo step), then re-runs the search.
+   * An empty replacement string deletes all matched text.
+   *
+   * No-op when there are no matches or no host.
+   *
+   * @returns {FindReplaceResult} Updated match position and total.
+   */
+  replaceAll() {
+    if (this.context.state.getTotal() > 0 && this.flushFn && this.context.hostRef) {
+      const matches = this.context.state.getMatches();
+      // Iterate in reverse so that mutating a later match does not shift the
+      // startOffset/endOffset of earlier matches that have not yet been processed.
+      for (let i = matches.length - 1; i >= 0; i -= 1) {
+        this.applyMatchReplacement(matches[i]);
+      }
+      this.flushFn(this.context.hostRef.value);
+      this.context.state.clear();
+      this.context.state.search(this.context.hostRef.value, this.context.keyword);
+    }
+    return this.applyAndGetResult();
+  }
+  // ─── Private ──────────────────────────────────────────────────────────────────
+  /**
+   * Directly mutates the matched nodes in the live content tree.
+   * `position.node` is already a reference into `this.context.hostRef.value`,
+   * so no cloning or path navigation is needed.
+   *
+   * For multi-node (cross-span) matches the first node receives the replacement
+   * text and every subsequent node has its matched slice deleted.
+   *
+   * This method mutates the content tree in place. The caller is
+   * responsible for calling `state.clear()` afterwards to invalidate the
+   * flat-text cache, which uses reference equality and will not detect the
+   * in-place change automatically.
+   *
+   * @param {FindMatch} match - The match to replace.
+   * @returns {void} No return value.
+   */
+  applyMatchReplacement(match) {
+    match.nodes.forEach((position, index) => {
+      const replacementText = index === 0 ? this.replacement : '';
+      position.node.text =
+        position.node.text.slice(0, position.startOffset) +
+          replacementText +
+          position.node.text.slice(position.endOffset);
+    });
+  }
+}
+
+/**
+ * Toolbar button renderer for the Find & Replace extension.
+ *
+ * Responsible only for UI concerns:
+ * - Renders the toolbar button wrapped in a vega-popover.
+ * - Wires panel events to the {@link FindController} and {@link ReplaceController}.
+ * - Pushes controller results back to the panel display.
+ *
+ * Both controllers share a single {@link FindReplaceControllerContext} so they
+ * operate on the same search state and highlight overlays.
+ */
+class FindReplaceToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  constructor() {
+    super(...arguments);
+    this.sharedContext = createFindReplaceControllerContext();
+    this.findController = new FindController(this.sharedContext);
+    this.replaceController = new ReplaceController(this.sharedContext);
+    this.panelRef = null;
+    this.popoverRef = null;
+    this.isPopoverOpen = false;
+    this.scrollOnNextRefresh = false;
+    this.debouncedRefresh = debounce(this.onContentChanged, 100, this);
+    /* eslint-disable jsdoc/require-jsdoc */
+    this.panelActionHandlers = {
+      'find': () => this.findController.find(),
+      'prev': () => this.findController.prev(),
+      'next': () => this.findController.next(),
+      'replace': () => {
+        this.scrollOnNextRefresh = true;
+        return this.replaceController.replace();
+      },
+      'replace-all': () => {
+        this.scrollOnNextRefresh = true;
+        return this.replaceController.replaceAll();
+      },
+      'match-case': (data) => this.findController.setMatchCase(data),
+      'whole-words': (data) => this.findController.setWholeWords(data),
+      'close': () => this.closePanel(),
+    };
+  }
+  /* eslint-enable jsdoc/require-jsdoc */
+  /**
+   * @inheritDoc
+   */
+  render(h, editorContext) {
+    this.syncEditorState(editorContext);
+    return h('vega-popover', {
+      trigger: 'none',
+      alignment: 'start',
+      placement: 'bottom',
+      showArrow: false,
+      isScreenPosition: true,
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      ref: (ref) => {
+        if (ref) {
+          this.popoverRef = ref;
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverHide, () => {
+            this.isPopoverOpen = false;
+            this.findController.clear();
+            this.updatePanel({ current: 0, total: 0 });
+          });
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, () => {
+            this.isPopoverOpen = true;
+          });
+        }
+      },
+    }, [
+      h('div', { slot: 'popover' }, [
+        h('vega-rich-text-find-replace-panel', {
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          ref: (ref) => {
+            if (ref) {
+              this.panelRef = ref;
+              DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, (e) => {
+                if (e.detail.type === 'keyword') {
+                  this.updatePanel(this.findController.setKeyword(e.detail.value));
+                }
+                else if (e.detail.type === 'replace') {
+                  this.replaceController.setReplacement(e.detail.value);
+                }
+              });
+              DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, (payload) => {
+                this.handlePanelAction(payload.detail);
+              });
+            }
+          },
+        }),
+      ]),
+      h('div', { slot: 'popover-content' }, this.renderButton(h, editorContext, {
+        icon: 'rte-find-replace',
+        tooltip: { text: VegaInternalTranslation.t('Find and replace') },
+      })),
+    ]);
+  }
+  /**
+   * Toggles the popover open/close when the toolbar button is clicked.
+   */
+  handleButtonClick() {
+    if (this.popoverRef) {
+      if (this.isPopoverOpen) {
+        void this.popoverRef.hide();
+      }
+      else {
+        void this.popoverRef.show();
+      }
+    }
+  }
+  /* istanbul ignore next */
+  /**
+   * Not used — this button has no dropdown.
+   */
+  handleDropdownClick() {
+    // no-op
+  }
+  // ─── Private helpers ──────────────────────────────────────────────────────────
+  /**
+   * Synchronizes internal state with the editor context on each render cycle.
+   * Registers the host reference and content-change listener, and hides the
+   * popover if the toolbar item becomes hidden while open.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context.
+   */
+  syncEditorState(editorContext) {
+    this.findController.setHost(editorContext.host);
+    const extensionContext = this.getExtensionContext(editorContext.host);
+    if (extensionContext) {
+      this.replaceController.setFlushValue(extensionContext.flushValue);
+    }
+    DomNodeSubjectObserverFactory.addUniqueObserverToNode(editorContext.host, VegaChange, this.debouncedRefresh);
+    if (this.isHidden(editorContext) && this.isPopoverOpen && this.popoverRef) {
+      void this.popoverRef.hide();
+    }
+  }
+  /**
+   * Dispatches panel button actions to the controller.
+   *
+   * @param {FindReplacePanelAction} panelAction - The structured action emitted by the panel.
+   */
+  handlePanelAction(panelAction) {
+    const { action, data } = panelAction;
+    const handler = this.panelActionHandlers[action];
+    if (handler) {
+      const result = handler(data);
+      if (result) {
+        this.updatePanel(result);
+      }
+    }
+  }
+  /**
+   * Pushes result to the panel counter display.
+   *
+   * @param {FindReplaceResult} result - The current/total values.
+   */
+  updatePanel(result) {
+    if (this.panelRef) {
+      void this.panelRef.updateResult(result.current, result.total);
+    }
+  }
+  /**
+   * Content changed — ask the controller to refresh search results.
+   */
+  onContentChanged() {
+    if (!this.isPopoverOpen) {
+      return;
+    }
+    const shouldScroll = this.scrollOnNextRefresh;
+    this.scrollOnNextRefresh = false;
+    const result = this.findController.refresh(shouldScroll);
+    if (result) {
+      this.updatePanel(result);
+    }
+  }
+  /**
+   * Closes the panel popover.
+   */
+  closePanel() {
+    if (this.popoverRef) {
+      void this.popoverRef.hide();
+    }
+  }
+}
+(() => {
+  VegaInternalIconManager.register({ 'rte-find-replace': findReplaceIcon });
+})();
 
-const LATIN_CHARACTERS = [
-  { character: 'Ā', title: 'Latin capital letter a with macron' },
-  { character: 'ā', title: 'Latin small letter a with macron' },
-  { character: 'Ă', title: 'Latin capital letter a with breve' },
-  { character: 'ă', title: 'Latin small letter a with breve' },
-  { character: 'Ą', title: 'Latin capital letter a with ogonek' },
-  { character: 'ą', title: 'Latin small letter a with ogonek' },
-  { character: 'Ć', title: 'Latin capital letter c with acute' },
-  { character: 'ć', title: 'Latin small letter c with acute' },
-  { character: 'Ĉ', title: 'Latin capital letter c with circumflex' },
-  { character: 'ĉ', title: 'Latin small letter c with circumflex' },
-  { character: 'Ċ', title: 'Latin capital letter c with dot above' },
-  { character: 'ċ', title: 'Latin small letter c with dot above' },
-  { character: 'Č', title: 'Latin capital letter c with caron' },
-  { character: 'č', title: 'Latin small letter c with caron' },
-  { character: 'Ď', title: 'Latin capital letter d with caron' },
-  { character: 'ď', title: 'Latin small letter d with caron' },
-  { character: 'Đ', title: 'Latin capital letter d with stroke' },
-  { character: 'đ', title: 'Latin small letter d with stroke' },
-  { character: 'Ē', title: 'Latin capital letter e with macron' },
-  { character: 'ē', title: 'Latin small letter e with macron' },
-  { character: 'Ĕ', title: 'Latin capital letter e with breve' },
-  { character: 'ĕ', title: 'Latin small letter e with breve' },
-  { character: 'Ė', title: 'Latin capital letter e with dot above' },
-  { character: 'ė', title: 'Latin small letter e with dot above' },
-  { character: 'Ę', title: 'Latin capital letter e with ogonek' },
-  { character: 'ę', title: 'Latin small letter e with ogonek' },
-  { character: 'Ě', title: 'Latin capital letter e with caron' },
-  { character: 'ě', title: 'Latin small letter e with caron' },
-  { character: 'Ĝ', title: 'Latin capital letter g with circumflex' },
-  { character: 'ĝ', title: 'Latin small letter g with circumflex' },
-  { character: 'Ğ', title: 'Latin capital letter g with breve' },
-  { character: 'ğ', title: 'Latin small letter g with breve' },
-  { character: 'Ġ', title: 'Latin capital letter g with dot above' },
-  { character: 'ġ', title: 'Latin small letter g with dot above' },
-  { character: 'Ģ', title: 'Latin capital letter g with cedilla' },
-  { character: 'ģ', title: 'Latin small letter g with cedilla' },
-  { character: 'Ĥ', title: 'Latin capital letter h with circumflex' },
-  { character: 'ĥ', title: 'Latin small letter h with circumflex' },
-  { character: 'Ħ', title: 'Latin capital letter h with stroke' },
-  { character: 'ħ', title: 'Latin small letter h with stroke' },
-  { character: 'Ĩ', title: 'Latin capital letter i with tilde' },
-  { character: 'ĩ', title: 'Latin small letter i with tilde' },
-  { character: 'Ī', title: 'Latin capital letter i with macron' },
-  { character: 'ī', title: 'Latin small letter i with macron' },
-  { character: 'Ĭ', title: 'Latin capital letter i with breve' },
-  { character: 'ĭ', title: 'Latin small letter i with breve' },
-  { character: 'Į', title: 'Latin capital letter i with ogonek' },
-  { character: 'į', title: 'Latin small letter i with ogonek' },
-  { character: 'İ', title: 'Latin capital letter i with dot above' },
-  { character: 'ı', title: 'Latin small letter dotless i' },
-  { character: 'IJ', title: 'Latin capital ligature ij' },
-  { character: 'ij', title: 'Latin small ligature ij' },
-  { character: 'Ĵ', title: 'Latin capital letter j with circumflex' },
-  { character: 'ĵ', title: 'Latin small letter j with circumflex' },
-  { character: 'Ķ', title: 'Latin capital letter k with cedilla' },
-  { character: 'ķ', title: 'Latin small letter k with cedilla' },
-  { character: 'ĸ', title: 'Latin small letter kra' },
-  { character: 'Ĺ', title: 'Latin capital letter l with acute' },
-  { character: 'ĺ', title: 'Latin small letter l with acute' },
-  { character: 'Ļ', title: 'Latin capital letter l with cedilla' },
-  { character: 'ļ', title: 'Latin small letter l with cedilla' },
-  { character: 'Ľ', title: 'Latin capital letter l with caron' },
-  { character: 'ľ', title: 'Latin small letter l with caron' },
-  { character: 'Ŀ', title: 'Latin capital letter l with middle dot' },
-  { character: 'ŀ', title: 'Latin small letter l with middle dot' },
-  { character: 'Ł', title: 'Latin capital letter l with stroke' },
-  { character: 'ł', title: 'Latin small letter l with stroke' },
-  { character: 'Ń', title: 'Latin capital letter n with acute' },
-  { character: 'ń', title: 'Latin small letter n with acute' },
-  { character: 'Ņ', title: 'Latin capital letter n with cedilla' },
-  { character: 'ņ', title: 'Latin small letter n with cedilla' },
-  { character: 'Ň', title: 'Latin capital letter n with caron' },
-  { character: 'ň', title: 'Latin small letter n with caron' },
-  { character: 'ʼn', title: 'Latin small letter n preceded by apostrophe' },
-  { character: 'Ŋ', title: 'Latin capital letter eng' },
-  { character: 'ŋ', title: 'Latin small letter eng' },
-  { character: 'Ō', title: 'Latin capital letter o with macron' },
-  { character: 'ō', title: 'Latin small letter o with macron' },
-  { character: 'Ŏ', title: 'Latin capital letter o with breve' },
-  { character: 'ŏ', title: 'Latin small letter o with breve' },
-  { character: 'Ő', title: 'Latin capital letter o with double acute' },
-  { character: 'ő', title: 'Latin small letter o with double acute' },
-  { character: 'Œ', title: 'Latin capital ligature oe' },
-  { character: 'œ', title: 'Latin small ligature oe' },
-  { character: 'Ŕ', title: 'Latin capital letter r with acute' },
-  { character: 'ŕ', title: 'Latin small letter r with acute' },
-  { character: 'Ŗ', title: 'Latin capital letter r with cedilla' },
-  { character: 'ŗ', title: 'Latin small letter r with cedilla' },
-  { character: 'Ř', title: 'Latin capital letter r with caron' },
-  { character: 'ř', title: 'Latin small letter r with caron' },
-  { character: 'Ś', title: 'Latin capital letter s with acute' },
-  { character: 'ś', title: 'Latin small letter s with acute' },
-  { character: 'Ŝ', title: 'Latin capital letter s with circumflex' },
-  { character: 'ŝ', title: 'Latin small letter s with circumflex' },
-  { character: 'Ş', title: 'Latin capital letter s with cedilla' },
-  { character: 'ş', title: 'Latin small letter s with cedilla' },
-  { character: 'Š', title: 'Latin capital letter s with caron' },
-  { character: 'š', title: 'Latin small letter s with caron' },
-  { character: 'Ţ', title: 'Latin capital letter t with cedilla' },
-  { character: 'ţ', title: 'Latin small letter t with cedilla' },
-  { character: 'Ť', title: 'Latin capital letter t with caron' },
-  { character: 'ť', title: 'Latin small letter t with caron' },
-  { character: 'Ŧ', title: 'Latin capital letter t with stroke' },
-  { character: 'ŧ', title: 'Latin small letter t with stroke' },
-  { character: 'Ũ', title: 'Latin capital letter u with tilde' },
-  { character: 'ũ', title: 'Latin small letter u with tilde' },
-  { character: 'Ū', title: 'Latin capital letter u with macron' },
-  { character: 'ū', title: 'Latin small letter u with macron' },
-  { character: 'Ŭ', title: 'Latin capital letter u with breve' },
-  { character: 'ŭ', title: 'Latin small letter u with breve' },
-  { character: 'Ů', title: 'Latin capital letter u with ring above' },
-  { character: 'ů', title: 'Latin small letter u with ring above' },
-  { character: 'Ű', title: 'Latin capital letter u with double acute' },
-  { character: 'ű', title: 'Latin small letter u with double acute' },
-  { character: 'Ų', title: 'Latin capital letter u with ogonek' },
-  { character: 'ų', title: 'Latin small letter u with ogonek' },
-  { character: 'Ŵ', title: 'Latin capital letter w with circumflex' },
-  { character: 'ŵ', title: 'Latin small letter w with circumflex' },
-  { character: 'Ŷ', title: 'Latin capital letter y with circumflex' },
-  { character: 'ŷ', title: 'Latin small letter y with circumflex' },
-  { character: 'Ÿ', title: 'Latin capital letter y with diaeresis' },
-  { character: 'Ź', title: 'Latin capital letter z with acute' },
-  { character: 'ź', title: 'Latin small letter z with acute' },
-  { character: 'Ż', title: 'Latin capital letter z with dot above' },
-  { character: 'ż', title: 'Latin small letter z with dot above' },
-  { character: 'Ž', title: 'Latin capital letter z with caron' },
-  { character: 'ž', title: 'Latin small letter z with caron' },
-  { character: 'ſ', title: 'Latin small letter long s' },
-];
+/**
+ * Find & Replace extension for Vega Rich Text Editor.
+ *
+ * Registers a toolbar button (magnifying-glass icon) that toggles the find-replace panel.
+ * Each editor host gets its own isolated FindReplaceState and toolbar renderer instance,
+ * created during the per-host prepareBeforeLoad lifecycle hook.
+ *
+ * Toolbar key: 'findReplace'
+ */
+class VegaRTEFindReplaceExtension extends VegaRTEExtension {
+  /** @inheritDoc */
+  prepareBeforeLoad(host) {
+    this.registerToolbarButtonRenderer(VegaRTEFindReplaceExtension.TOOLBAR_BUTTON_KEY, new FindReplaceToolbarButtonRenderer(), host);
+  }
+}
+VegaRTEFindReplaceExtension.TOOLBAR_BUTTON_KEY = 'findReplace';
 
-const MATHEMATICAL_CHARACTERS = [
-  { character: '<', title: 'Less-than sign' },
-  { character: '>', title: 'Greater-than sign' },
-  { character: '≤', title: 'Less-than or equal to' },
-  { character: '≥', title: 'Greater-than or equal to' },
-  { character: '–', title: 'En dash' },
-  { character: '—', title: 'Em dash' },
-  { character: '¯', title: 'Macron' },
-  { character: '‾', title: 'Overline' },
-  { character: '°', title: 'Degree sign' },
-  { character: '−', title: 'Minus sign' },
-  { character: '±', title: 'Plus-minus sign' },
-  { character: '÷', title: 'Division sign' },
-  { character: '⁄', title: 'Fraction slash' },
-  { character: '×', title: 'Multiplication sign' },
-  { character: 'ƒ', title: 'Latin small letter f with hook' },
-  { character: '∫', title: 'Integral' },
-  { character: '∑', title: 'N-ary summation' },
-  { character: '∞', title: 'Infinity' },
-  { character: '√', title: 'Square root' },
-  { character: '∼', title: 'Tilde operator' },
-  { character: '≅', title: 'Approximately equal to' },
-  { character: '≈', title: 'Almost equal to' },
-  { character: '≠', title: 'Not equal to' },
-  { character: '≡', title: 'Identical to' },
-  { character: '∈', title: 'Element of' },
-  { character: '∉', title: 'Not an element of' },
-  { character: '∋', title: 'Contains as member' },
-  { character: '∏', title: 'N-ary product' },
-  { character: '∧', title: 'Logical and' },
-  { character: '∨', title: 'Logical or' },
-  { character: '¬', title: 'Not sign' },
-  { character: '∩', title: 'Intersection' },
-  { character: '∪', title: 'Union' },
-  { character: '∂', title: 'Partial differential' },
-  { character: '∀', title: 'For all' },
-  { character: '∃', title: 'There exists' },
-  { character: '∅', title: 'Empty set' },
-  { character: '∇', title: 'Nabla' },
-  { character: '∗', title: 'Asterisk operator' },
-  { character: '∝', title: 'Proportional to' },
-  { character: '∠', title: 'Angle' },
-  { character: '¼', title: 'Vulgar fraction one quarter' },
-  { character: '½', title: 'Vulgar fraction one half' },
-  { character: '¾', title: 'Vulgar fraction three quarters' },
+/**
+ * Default line height options used by the line-height extension when no
+ * custom options are provided.
+ */
+const VegaRTEDefaultLineHeightOptions = [
+  { title: '0.5', value: '0.5' },
+  { title: '1', value: '1' },
+  { title: '1.5', value: '1.5' },
+  { title: '2', value: '2' },
+  { title: '2.5', value: '2.5' },
 ];
 
-const TEXT_CHARACTERS = [
-  { character: '‹', title: 'Single left-pointing angle quotation mark' },
-  { character: '›', title: 'Single right-pointing angle quotation mark' },
-  { character: '«', title: 'Left-pointing double angle quotation mark' },
-  { character: '»', title: 'Right-pointing double angle quotation mark' },
-  { character: '‘', title: 'Left single quotation mark' },
-  { character: '’', title: 'Right single quotation mark' },
-  { character: '“', title: 'Left double quotation mark' },
-  { character: '”', title: 'Right double quotation mark' },
-  { character: '‚', title: 'Single low-9 quotation mark' },
-  { character: '„', title: 'Double low-9 quotation mark' },
-  { character: '¡', title: 'Inverted exclamation mark' },
-  { character: '¿', title: 'Inverted question mark' },
-  { character: '‥', title: 'Two dot leader' },
-  { character: '…', title: 'Horizontal ellipsis' },
-  { character: '‡', title: 'Double dagger' },
-  { character: '‰', title: 'Per mille sign' },
-  { character: '‱', title: 'Per ten thousand sign' },
-  { character: '‼', title: 'Double exclamation mark' },
-  { character: '⁈', title: 'Question exclamation mark' },
-  { character: '⁉', title: 'Exclamation question mark' },
-  { character: '⁇', title: 'Double question mark' },
-  { character: '©', title: 'Copyright sign' },
-  { character: '®', title: 'Registered sign' },
-  { character: '™', title: 'Trade mark sign' },
-  { character: '§', title: 'Section sign' },
-  { character: '¶', title: 'Paragraph sign' },
-  { character: '⁋', title: 'Reversed paragraph sign' },
-];
+var RTELineHeightExtensionAnnotationTypeEnum;
+(function (RTELineHeightExtensionAnnotationTypeEnum) {
+  RTELineHeightExtensionAnnotationTypeEnum["LINE_HEIGHT"] = "LINE_HEIGHT";
+})(RTELineHeightExtensionAnnotationTypeEnum || (RTELineHeightExtensionAnnotationTypeEnum = {}));
+/**
+ * Annotation to set block line height.
+ */
+class LineHeightAnnotation extends BlockAnnotation {
+  constructor(lineHeight) {
+    super();
+    this.type = RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT;
+    this.lineHeight = lineHeight;
+  }
+  /**
+   * Generate the map item for the annotation.
+   *
+   * @param {string} lineHeight - Line height value.
+   * @returns {[RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT, LineHeightAnnotation]} Map item for the annotation.
+   */
+  static from(lineHeight) {
+    return [RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT, new LineHeightAnnotation(lineHeight)];
+  }
+  /**
+   * Get the default standalone styles for a given line height value.
+   *
+   * @param {string} lineHeight - The line height value.
+   * @returns {AnnotationStyle} The default standalone styles.
+   */
+  static getDefaultStyles(lineHeight) {
+    return { lineHeight };
+  }
+  /**
+   * Generate the JSON item of the annotation.
+   *
+   * @returns {Record<string, unknown>} JSON representation of the annotation.
+   */
+  toJSON() {
+    return {
+      lineHeight: this.lineHeight,
+    };
+  }
+  /**
+   * @inheritDoc
+   */
+  renderClass() {
+    return null;
+  }
+  /**
+   * @inheritDoc
+   */
+  clone() {
+    return new LineHeightAnnotation(this.lineHeight);
+  }
+  /**
+   * @inheritDoc
+   */
+  renderStyle() {
+    return LineHeightAnnotation.getDefaultStyles(this.lineHeight);
+  }
+}
+
+/**
+ * Action to update block line height annotation.
+ */
+class LineHeightAnnotationAction extends AnnotationAction {
+  constructor(lineHeight) {
+    super();
+    this.isFlushable = true;
+    this.lineHeight = lineHeight;
+  }
+  /**
+   * Converts the action to an annotation.
+   *
+   * @returns {LineHeightAnnotation} The annotation.
+   */
+  toAnnotation() {
+    return new LineHeightAnnotation(this.lineHeight);
+  }
+}
 
-const VegaRTESpecialCharactersLatin = {
-  key: 'latin',
-  label: 'Latin',
-  characters: LATIN_CHARACTERS,
-};
-const VegaRTESpecialCharactersMathematical = {
-  key: 'mathematical',
-  label: 'Mathematical',
-  characters: MATHEMATICAL_CHARACTERS,
-};
-const VegaRTESpecialCharactersArrows = {
-  key: 'arrows',
-  label: 'Arrows',
-  characters: ARROW_CHARACTERS,
-};
-const VegaRTESpecialCharactersCurrency = {
-  key: 'currency',
-  label: 'Currency',
-  characters: CURRENCY_CHARACTERS,
-};
-const VegaRTESpecialCharactersText = {
-  key: 'text',
-  label: 'Text',
-  characters: TEXT_CHARACTERS,
-};
-const VegaRTESpecialCharactersEssentials = [
-  VegaRTESpecialCharactersCurrency,
-  VegaRTESpecialCharactersText,
-  VegaRTESpecialCharactersMathematical,
-  VegaRTESpecialCharactersArrows,
-  VegaRTESpecialCharactersLatin,
-];
+/**
+ * Update the block line height strategy.
+ *
+ * Registered for RTETextBlock and RTEListItemBlock, so the
+ * target type is widened to the common RTEBlock base.
+ */
+class BlockUpdateLineHeightStrategy extends ActionHandleStrategy {
+  /**
+   * Updating the line height of a block requires cascading updates to the custom style.
+   *
+   * @param {LineHeightAnnotationAction} _action - The line height annotation action.
+   * @param {RTEBlock} target - The current block.
+   */
+  handleAction(_action, target) {
+    this.updateCustomStyleAnnotation(target, ['lineHeight']);
+  }
+}
 
-const specialCharactersIcon = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M224 80C126.8 80 48 158.8 48 256c0 63.7 33.8 119.5 84.6 150.4c11.4 7 19.4 19.6 19.4 34.2c0 21.8-17.6 39.4-39.4 39.4H24c-13.3 0-24-10.7-24-24s10.7-24 24-24H85.4C33.4 391 0 327.4 0 256C0 132.3 100.3 32 224 32s224 100.3 224 224c0 71.4-33.4 135-85.4 176H424c13.3 0 24 10.7 24 24s-10.7 24-24 24H335.4c-21.8 0-39.4-17.6-39.4-39.4c0-14.6 8-27.2 19.4-34.2C366.2 375.5 400 319.7 400 256c0-97.2-78.8-176-176-176z"/></svg>`,
+const lineHeight = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor"  d="M113.8 39.9c-4.6-5.1-11-7.9-17.8-7.9s-13.3 2.9-17.8 7.9l-72 80c-8.9 9.9-8.1 25 1.8 33.9s25 8.1 33.9-1.8L72 118.5V393.5L41.8 359.9c-8.9-9.9-24-10.7-33.9-1.8s-10.7 24-1.8 33.9l72 80c4.6 5.1 11 7.9 17.8 7.9s13.3-2.9 17.8-7.9l72-80c8.9-9.9 8.1-25-1.8-33.9s-25-8.1-33.9 1.8L120 393.5V118.5l30.2 33.5c8.9 9.9 24 10.7 33.9 1.8s10.7-24 1.8-33.9l-72-80zM248 72c-13.3 0-24 10.7-24 24s10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248zm0 160c-13.3 0-24 10.7-24 24s10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248zM224 416c0 13.3 10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248c-13.3 0-24 10.7-24 24z"/></svg>`,
 };
 
 /**
- * Toolbar button renderer for the Special Characters extension.
- * Renders a toolbar button with an Ω icon that opens a popover panel
- * with categorized character grids.
+ * Renderer for the line-height toolbar button in the Vega Rich Text Editor.
  */
-class RTESpecialCharactersToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
-  constructor(categories) {
+class RTELineHeightToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  constructor(options) {
     super();
-    this.panelRef = null;
-    this.categories = categories;
+    this.options = options;
   }
   /**
-   * Renders the special characters toolbar button wrapped in a popover.
-   *
-   * @param {VegaRTECreateElementFunction} h - Create element function.
-   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
-   * @returns {VegaRTERenderResult} - The toolbar button render result.
+   * @inheritDoc
    */
-  render(h, editorContext) {
-    return h('vega-popover', {
-      trigger: 'click',
-      alignment: 'start',
-      placement: 'bottom',
-      showArrow: false,
-      isScreenPosition: true,
-      // eslint-disable-next-line jsdoc/require-jsdoc
-      ref: (ref) => {
-        if (ref) {
-          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, () => {
-            this.handlePopoverShow();
-          });
-        }
-      },
+  render(createElement, editorContext) {
+    const dropdownItems = this.options.map((item) => {
+      var _a;
+      return ({
+        key: item.value,
+        label: (_a = item.title) !== null && _a !== void 0 ? _a : item.value,
+      });
+    });
+    return this.renderDropdown(createElement, editorContext, {
+      selectType: 'single',
+      selectedSourceKey: this.getSelectedSourceValue(editorContext),
     }, [
-      h('div', { slot: 'popover' }, [
-        h('vega-rich-text-special-characters-panel', {
-          categories: this.categories,
-          // eslint-disable-next-line jsdoc/require-jsdoc
-          ref: (ref) => {
-            if (ref) {
-              this.panelRef = ref;
-              DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, 
-              // eslint-disable-next-line jsdoc/require-jsdoc
-              (payload) => {
-                this.insertCharacter(editorContext, payload.detail);
-              });
-            }
-          },
-        }),
-      ]),
-      h('div', { slot: 'popover-content' }, this.renderButton(h, editorContext, {
-        icon: 'rte-special-characters',
-        tooltip: { text: 'Special Characters' },
-      })),
+      this.renderButton(createElement, editorContext, {
+        icon: 'line-height',
+        showArrowIcon: true,
+        tooltip: { text: VegaInternalTranslation.t('Line Height') },
+      }),
+      this.renderDropdownListTemplate(createElement, dropdownItems, editorContext),
     ]);
   }
   /**
    * @inheritDoc
    */
-  handleButtonClick() {
-    // Popover handles open/close via trigger='click'
+  isSelected() {
+    return false;
   }
-  /* istanbul ignore next */
   /**
    * @inheritDoc
    */
-  handleDropdownClick() {
-    // No dropdown used
+  isDisabled(editorContext) {
+    var _a;
+    if (editorContext.host.disabled) {
+      return true;
+    }
+    const extensionContext = this.getExtensionContext(editorContext.host);
+    const selectedNodes = (_a = extensionContext === null || extensionContext === void 0 ? void 0 : extensionContext.getSelectedNodes()) !== null && _a !== void 0 ? _a : [];
+    if (selectedNodes.some((node) => {
+      var _a;
+      return ((_a = node.getAnnotationByType(NodeAnnotationTypeEnum.CODE)) === null || _a === void 0 ? void 0 : _a.code) ||
+        node.parent instanceof RTECodeBlock;
+    })) {
+      return true;
+    }
+    const selectedBlocks = this.getSelectedBlocks(editorContext);
+    return selectedBlocks.some((block) => block instanceof RTECodeBlock ||
+      block instanceof RTEImageBlock ||
+      !ActionHandleStrategyRegistry.canHandle(LineHeightAnnotationAction.name, block));
   }
   /**
-   * Resets the panel and moves focus to the category select when the
-   * popover opens.
+   * @inheritDoc
    */
-  handlePopoverShow() {
-    if (this.panelRef) {
-      void this.panelRef.resetPanel();
+  handleDropdownClick(itemValue, editorContext) {
+    const selectedLineHeight = itemValue;
+    const selectedBlocks = this.getSelectedBlocks(editorContext);
+    selectedBlocks.forEach((block) => {
+      block.apply(new LineHeightAnnotationAction(selectedLineHeight));
+    });
+  }
+  /**
+   * Handle direct toolbar button click.
+   */
+  handleButtonClick() {
+    // No direct click action; selection happens in dropdown options.
+  }
+  /**
+   * Get the selected line-height key for dropdown selection state.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - Current toolbar context.
+   * @returns {string} Selected line-height key or empty string for mixed/none.
+   */
+  getSelectedSourceValue(editorContext) {
+    const selectedBlocks = this.getSelectedBlocks(editorContext);
+    if (selectedBlocks.length === 0) {
+      return '';
+    }
+    const firstAnnotation = selectedBlocks[0].getAnnotationByType(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
+    const isSameLineHeight = selectedBlocks.every((block) => {
+      const annotation = block.getAnnotationByType(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
+      return (annotation === null || annotation === void 0 ? void 0 : annotation.lineHeight) === (firstAnnotation === null || firstAnnotation === void 0 ? void 0 : firstAnnotation.lineHeight);
+    });
+    return isSameLineHeight && firstAnnotation ? firstAnnotation.lineHeight : '';
+  }
+  /**
+   * Resolve selected blocks from selected nodes with range fallback.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - Current toolbar context.
+   * @returns {RTEBlock[]} Selected blocks.
+   */
+  getSelectedBlocks(editorContext) {
+    var _a, _b;
+    const extensionContext = this.getExtensionContext(editorContext.host);
+    const selectedNodes = (_a = extensionContext === null || extensionContext === void 0 ? void 0 : extensionContext.getSelectedNodes()) !== null && _a !== void 0 ? _a : [];
+    const selectedBlocks = [];
+    selectedNodes.forEach((node) => {
+      if (node.parent instanceof RTEBlock && !selectedBlocks.includes(node.parent)) {
+        selectedBlocks.push(node.parent);
+      }
+    });
+    if (selectedBlocks.length === 0 && ((_b = editorContext.rteRange.startNode) === null || _b === void 0 ? void 0 : _b.parent) instanceof RTEBlock) {
+      selectedBlocks.push(editorContext.rteRange.startNode.parent);
     }
+    return selectedBlocks;
+  }
+}
+(() => {
+  VegaInternalIconManager.register({
+    'line-height': lineHeight,
+  });
+})();
+
+const LINE_HEIGHT_AWARE_BLOCK_NAMES = new Set([
+  RTETextBlock.name,
+  RTEListItemBlock.name,
+]);
+/** Handle line height annotation. */
+class LineHeightAnnotationHandler extends AnnotationGeneratorStrategyAbstract {
+  constructor(options = VegaRTEDefaultLineHeightOptions) {
+    super();
+    this.allowedLineHeights = new Set(options.map((option) => option.value));
   }
   /**
-   * Inserts a special character at the current cursor position using ReplaceSelectedTextAction,
-   * then restores the cursor position after flushing.
+   * Can be handled.
    *
-   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
-   * @param {string} char - The Unicode character to insert.
+   * @param {RTEDtoClassPrototype} targetDto - Target DTO.
+   * @returns {boolean} Whether the target DTO supports line-height annotations.
    */
-  insertCharacter(editorContext, char) {
-    const currentRange = editorContext.rteRange;
-    const cursorNode = currentRange.startNode;
-    if (!cursorNode)
-      return;
-    const target = this.isCaretOnLineBreak(cursorNode, currentRange)
-      ? this.insertAtLineBreak(cursorNode, char, currentRange)
-      : this.insertAtTextNode(cursorNode, char, currentRange);
-    editorContext.host.value.apply(new UpdateCursorPositionAction(target.node, target.offset));
+  canHandle(targetDto) {
+    return LINE_HEIGHT_AWARE_BLOCK_NAMES.has(targetDto.name);
   }
   /**
-   * Checks whether the caret is collapsed on a Shift+Enter line-break text node.
+   * Extract inline `line-height` as a semantic `lineHeight` annotation.
    *
-   * @param {RTENode} cursorNode - The current cursor node.
-   * @param {RTERange} range - The current selection range.
-   * @returns {boolean} True if the caret is collapsed on a '\n' text node.
+   * @param {HTMLElement} [element] - Current element.
+   * @returns {VegaRTEBlockAnnotations} `{ lineHeight }` when present, otherwise `{}`.
    */
-  isCaretOnLineBreak(cursorNode, range) {
-    return (cursorNode instanceof RTETextNode &&
-      cursorNode.text === '\n' &&
-      range.startOffset === range.endOffset);
+  handle(element) {
+    var _a, _b;
+    const lineHeight = (_b = (_a = element === null || element === void 0 ? void 0 : element.style.lineHeight) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
+    if (!lineHeight) {
+      return {};
+    }
+    if (!this.allowedLineHeights.has(lineHeight)) {
+      return {};
+    }
+    return { lineHeight };
+  }
+}
+
+/**
+ * Removes a redundant inline `customStyle.lineHeight` when it duplicates the
+ * semantic `lineHeight` annotation during HTML-to-DTO conversion.
+ *
+ * Note: moving out-of-list line-height values from the semantic annotation to
+ * `customStyle.lineHeight` is handled by the per-host interceptor in
+ * `line-height-host-interceptor.ts`, not here.
+ */
+class LineHeightFilterStylesStrategy extends RTEFilterStylesStrategy {
+  constructor() {
+    super(...arguments);
+    this.stylesToBeFiltered = {};
   }
   /**
-   * Default insert path: replace the selected range on a regular text node.
+   * Always run this strategy, even when autoMatchFormat is disabled.
    *
-   * @param {RTENode} cursorNode - The current cursor node.
-   * @param {string} char - The Unicode character to insert.
-   * @param {RTERange} range - The current selection range.
-   * @returns {CaretTarget} The node and offset for the resulting caret position.
+   * @returns {boolean} Always true.
    */
-  insertAtTextNode(cursorNode, char, range) {
-    const action = new ReplaceSelectedTextAction(char, range);
-    action.isFlushable = true;
-    cursorNode.apply(action);
-    // Clamp to node length: empty paragraphs contain a ZWS in the DOM (startOffset=1)
-    // but the DTO text node is empty, so `startOffset + char.length` would overflow.
-    return {
-      node: cursorNode,
-      offset: Math.min(range.startOffset + char.length, cursorNode.getRangeEndOffset()),
-    };
+  get alwaysFilter() {
+    return true;
   }
   /**
-   * Line-break insert path: delegate to insertTextToLineBreakNode and place
-   * the caret at the end of the inserted text.
+   * Drop `customStyle.lineHeight` when it duplicates the semantic `lineHeight`.
    *
-   * @param {RTETextNode} lineBreakNode - The '\n' text node at the caret.
-   * @param {string} char - The Unicode character to insert.
-   * @param {RTERange} range - The current selection range.
-   * @returns {CaretTarget} Caret target.
+   * @param {VegaRTEAnnotations} annotations - The annotations to filter.
+   * @returns {VegaRTEAnnotations} The same annotations reference.
    */
-  insertAtLineBreak(lineBreakNode, char, range) {
-    return {
-      node: this.insertTextToLineBreakNode(lineBreakNode, char, range),
-      offset: char.length,
-    };
+  filterAnnotations(annotations) {
+    const blockAnnotations = annotations;
+    const lineHeight = blockAnnotations.lineHeight;
+    const customStyle = blockAnnotations.customStyle;
+    if (lineHeight && customStyle && customStyle.lineHeight === lineHeight) {
+      delete customStyle.lineHeight;
+    }
+    if (customStyle && Object.keys(customStyle).length === 0) {
+      delete blockAnnotations.customStyle;
+    }
+    return annotations;
+  }
+}
+
+/**
+ * Per-class set of allowed line-height values, updated as extension instances
+ * are constructed with (possibly custom) options.
+ */
+const allowedLineHeightsByClass = new WeakMap();
+/**
+ * Tracks which block classes have had their JSON `lineHeight` annotation
+ * handler installed, so we register it exactly once per class.
+ */
+const handlerInstalledClasses = new WeakSet();
+/**
+ * Move an out-of-range `lineHeight` annotation into `customStyle.lineHeight`.
+ *
+ * @param {RTEBlock} block - The block to inspect.
+ * @param {ReadonlySet<string>} allowed - Allowed line-height values.
+ */
+function normalizeLineHeightStyle(block, allowed) {
+  const annotation = block.annotationMap.get(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
+  if (!annotation || allowed.has(annotation.lineHeight)) {
+    return;
+  }
+  const value = annotation.lineHeight;
+  block.annotationMap.delete(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
+  const existing = block.annotationMap.get(CommonAnnotationTypeEnum.CUSTOM_STYLE);
+  if (existing) {
+    existing.customStyle = Object.assign(Object.assign({}, existing.customStyle), { lineHeight: value });
+  }
+  else {
+    block.annotationMap.set(...CustomStyleAnnotation.from({ lineHeight: value }));
+  }
+}
+/**
+ * Install the JSON `lineHeight` annotation handler for a block class.
+ *
+ * @param {LineHeightBlockClass} BlockClass - Target block class.
+ */
+function attachLineHeightFromJson(BlockClass) {
+  if (handlerInstalledClasses.has(BlockClass)) {
+    return;
+  }
+  handlerInstalledClasses.add(BlockClass);
+  VegaRTEExtension.attachAnnotationFromJson(BlockClass, 'lineHeight', (instance, value) => {
+    if (typeof value !== 'string' || value === '') {
+      return;
+    }
+    instance.annotationMap.set(...LineHeightAnnotation.from(value));
+    const allowed = allowedLineHeightsByClass.get(BlockClass);
+    if (allowed && allowed.size > 0) {
+      normalizeLineHeightStyle(instance, allowed);
+    }
+  });
+}
+/**
+ * Update the set of allowed line-height values for a block class.
+ *
+ * @param {LineHeightBlockClass} BlockClass - Target block class.
+ * @param {VegaRTELineHeightOption[]} options - Allowed line-height options.
+ */
+function setAllowedLineHeights(BlockClass, options) {
+  allowedLineHeightsByClass.set(BlockClass, new Set(options.map((option) => option.value)));
+}
+
+/**
+ * Rich Text Editor extension that adds configurable line-height support
+ * (toolbar control, annotations, content transforms, and JSON parsing).
+ */
+class VegaRTELineHeightExtension extends VegaRTEExtension {
+  constructor(options = VegaRTEDefaultLineHeightOptions) {
+    super();
+    this.options = options;
+    this.toolbarButtonRenderer = null;
+    this.registerAnnotationHandler(new LineHeightAnnotationHandler(this.options));
+    [RTETextBlock, RTEListItemBlock].forEach((BlockClass) => {
+      setAllowedLineHeights(BlockClass, this.options);
+    });
   }
   /**
-   * Mirror of InsertTextHandler.insertTextToLineBreakNode for the toolbar
-   * insert path: caret on a Shift+Enter line-break text node needs either a
-   * new sibling text node inserted before the break, or the break's text
-   * replaced. The default ReplaceSelectedTextAction + getRangeEndOffset()
-   * path returns 0 for '\n' text nodes and drops the caret in front of the
-   * inserted character.
+   * Register the per-host toolbar renderer so each editor on the page gets
+   * its own isolated line-height renderer instance.
    *
-   * @param {RTETextNode} lineBreakNode - The '\n' text node at the caret.
-   * @param {string} text - The text to insert.
-   * @param {RTERange} currentRange - The current selection range.
-   * @returns {RTETextNode} The node the caret should land in.
+   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
+   * @param {HTMLVegaRichTextEditorElement} host - The host element.
    */
-  insertTextToLineBreakNode(lineBreakNode, text, currentRange) {
-    // '\n' text nodes always live inside a text block in the RTE structure.
-    const textBlock = lineBreakNode.parent;
-    const index = textBlock.children.indexOf(lineBreakNode);
-    if (currentRange.startOffset === 0 && textBlock.children[index + 1]) {
-      const newTextNode = lineBreakNode.cloneWithText(text);
-      const insertAction = new InsertChildrenBeforeAction(lineBreakNode, newTextNode);
-      insertAction.isFlushable = true;
-      textBlock.apply(insertAction);
-      return newTextNode;
-    }
-    const updateAction = new UpdateTextAction(text);
-    updateAction.isFlushable = true;
-    lineBreakNode.apply(updateAction);
-    return lineBreakNode;
+  prepareBeforeLoad(host) {
+    this.toolbarButtonRenderer = new RTELineHeightToolbarButtonRenderer(this.options);
+    this.registerToolbarButtonRenderer(VegaRTELineHeightExtension.TOOLBAR_BUTTON_KEY, this.toolbarButtonRenderer, host);
   }
 }
 (() => {
-  VegaInternalIconManager.register({ 'rte-special-characters': specialCharactersIcon });
+  [RTETextBlock, RTEListItemBlock].forEach((BlockClass) => {
+    VegaRTEExtension.registerActionHandleStrategy(BlockClass.name, LineHeightAnnotationAction.name, new BlockUpdateLineHeightStrategy());
+    RTEFilterStylesStrategyRegistry.register(BlockClass.name, new LineHeightFilterStylesStrategy());
+    attachLineHeightFromJson(BlockClass);
+  });
 })();
+VegaRTELineHeightExtension.TOOLBAR_BUTTON_KEY = 'lineHeight';
+
+const paste = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M80 96v16c0 17.7 14.3 32 32 32h60.8c16.6-28.7 47.6-48 83.2-48h62c-7.1-27.6-32.2-48-62-48H215.4C211.6 20.9 188.2 0 160 0s-51.6 20.9-55.4 48H64C28.7 48 0 76.7 0 112V384c0 35.3 28.7 64 64 64h96V400H64c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H80zm64-40a16 16 0 1 1 32 0 16 16 0 1 1 -32 0zM256 464c-8.8 0-16-7.2-16-16V192c0-8.8 7.2-16 16-16H384v48c0 17.7 14.3 32 32 32h48V448c0 8.8-7.2 16-16 16H256zm192 48c35.3 0 64-28.7 64-64V227.9c0-12.7-5.1-24.9-14.1-33.9l-51.9-51.9c-9-9-21.2-14.1-33.9-14.1H256c-35.3 0-64 28.7-64 64V448c0 35.3 28.7 64 64 64H448z"/></svg>`,
+};
 
 /**
- * Vega Rich Text Editor Special Characters Extension.
- * Adds a toolbar button that opens a popover with categorized Unicode characters
- * for insertion into the editor content as plain text.
+ * Renders and manages the paste format chooser UI.
  */
-class VegaRTESpecialCharactersExtension extends VegaRTEExtension {
-  constructor(config) {
-    super();
-    this.categories = this.buildCategories(config);
+class RTEPasteChooserUI {
+  constructor(hostRoot, callbacks) {
+    this.hostRoot = hostRoot;
+    this.callbacks = callbacks;
+    this.chooserEl = null;
+    this.dropdownEl = null;
+    this.triggerButtonEl = null;
+  }
+  /**
+   * Opens the paste-mode chooser at the given position.
+   *
+   * @param {PasteChooserPosition} position Viewport position for the chooser.
+   */
+  open(position) {
+    this.destroy();
+    const doc = this.hostRoot.ownerDocument;
+    const chooser = doc.createElement('div');
+    chooser.setAttribute(RTEPasteChooserUI.CHOOSER_ATTR, 'true');
+    chooser.style.position = 'fixed';
+    chooser.style.zIndex = '1000';
+    chooser.style.left = `${position.left}px`;
+    chooser.style.top = `${position.top}px`;
+    const dropdownEl = this.createPasteChooserDropdown(doc, position.placement);
+    dropdownEl.placement = position.placement;
+    chooser.append(dropdownEl);
+    this.hostRoot.appendChild(chooser);
+    this.chooserEl = chooser;
+    this.dropdownEl = dropdownEl;
+    dropdownEl.addEventListener('vegaShow', () => {
+      if (this.triggerButtonEl) {
+        this.triggerButtonEl.selected = true;
+      }
+    });
+    dropdownEl.addEventListener('vegaHide', () => {
+      if (this.triggerButtonEl) {
+        this.triggerButtonEl.selected = false;
+      }
+    });
   }
-  /** @inheritDoc */
-  prepareBeforeLoad(host) {
-    this.registerToolbarButtonRenderer('special-characters', new RTESpecialCharactersToolbarButtonRenderer(this.categories), host);
+  /**
+   * Removes the chooser from the DOM.
+   */
+  destroy() {
+    var _a;
+    if (this.dropdownEl && typeof this.dropdownEl.hide === 'function') {
+      void this.dropdownEl.hide();
+    }
+    if ((_a = this.chooserEl) === null || _a === void 0 ? void 0 : _a.parentNode) {
+      this.chooserEl.parentNode.removeChild(this.chooserEl);
+    }
+    if (this.triggerButtonEl) {
+      this.triggerButtonEl.selected = false;
+    }
+    this.dropdownEl = null;
+    this.chooserEl = null;
+    this.triggerButtonEl = null;
   }
   /**
-   * Builds the final list of special character categories from the provided config.
+   * Determines whether the given event path targets the chooser.
    *
-   * @param {VegaRTESpecialCharactersConfig} config - Optional configuration with custom categories.
-   * @returns {VegaRTESpecialCharacterCategory[]} - The merged categories array.
+   * @param {EventTarget[]} eventPath Composed path of an event.
+   * @returns {boolean} `true` when the path includes the chooser.
    */
-  buildCategories(config) {
-    const includeDefaults = (config === null || config === void 0 ? void 0 : config.includeDefaults) !== false;
-    const defaultCategories = includeDefaults
-      ? VegaRTESpecialCharactersEssentials
-      : [];
-    if (!(config === null || config === void 0 ? void 0 : config.categories)) {
-      return defaultCategories;
+  includesEventPath(eventPath) {
+    if (!this.chooserEl) {
+      return false;
     }
-    return [...defaultCategories, ...config.categories];
+    const isDropdownContentClick = eventPath.some((target) => {
+      return 'tagName' in target && target.tagName === 'VEGA-DROPDOWN-CONTENT-BOX';
+    });
+    return eventPath.includes(this.chooserEl) || isDropdownContentClick;
+  }
+  /**
+   * Builds the dropdown element with the rich text paste option.
+   *
+   * @param {Document} doc Document used to create elements.
+   * @param {['bottom', 'top'] | ['top', 'bottom']} placement Preferred placement order.
+   * @returns {HTMLElement} Configured dropdown element.
+   */
+  createPasteChooserDropdown(doc, placement) {
+    const dropdownEl = doc.createElement('vega-dropdown');
+    dropdownEl.trigger = 'click';
+    dropdownEl.selectType = 'single';
+    dropdownEl.selectedSourceKey = 'rich';
+    dropdownEl.maxWidth = 220;
+    dropdownEl.alignment = 'start';
+    dropdownEl.itemDisplayRule = 'ellipsis';
+    const triggerButton = doc.createElement('vega-rich-text-editor-toolbar-button');
+    const arrowIcon = placement[0] === 'top' ? 'chevron-up' : 'chevron-down';
+    triggerButton.setAttribute(RTEPasteChooserUI.CHOOSER_TRIGGER_ATTR, 'true');
+    triggerButton.setAttribute('aria-label', VegaInternalTranslation.t('Paste options'));
+    triggerButton.setAttribute('arrow-icon', arrowIcon);
+    triggerButton.icon = 'rte-paste';
+    triggerButton.showArrowIcon = true;
+    triggerButton.selected = false;
+    this.triggerButtonEl = triggerButton;
+    const tooltipEl = doc.createElement('vega-tooltip');
+    tooltipEl.text = VegaInternalTranslation.t('Paste options');
+    tooltipEl.placement = ['bottom', 'top'];
+    tooltipEl.append(triggerButton);
+    dropdownEl.append(tooltipEl);
+    const itemsContainer = doc.createElement('div');
+    itemsContainer.setAttribute('slot', 'items');
+    itemsContainer.append(this.createDropdownItem(doc, 'rich', VegaInternalTranslation.t('Use rich text'), RTEPasteChooserUI.CHOOSER_RICH_ATTR));
+    dropdownEl.append(itemsContainer);
+    dropdownEl.addEventListener('vegaDropdownClick', (event) => {
+      const mode = event.detail;
+      if (mode === 'rich') {
+        this.callbacks.onModeSelect(mode);
+      }
+    });
+    return dropdownEl;
+  }
+  /**
+   * Creates a single dropdown item element for a paste mode.
+   *
+   * @param {Document} doc Document used to create the element.
+   * @param {PasteMode} key Paste mode key for the item.
+   * @param {string} label Display label for the item.
+   * @param {string} dataAttrName Data attribute marker for the item.
+   * @returns {HTMLVegaDropdownItemElement} Configured dropdown item element.
+   */
+  createDropdownItem(doc, key, label, dataAttrName) {
+    const itemEl = doc.createElement('vega-dropdown-item');
+    itemEl.itemKey = key;
+    itemEl.label = label;
+    itemEl.setAttribute(dataAttrName, 'true');
+    return itemEl;
   }
 }
+(() => {
+  VegaInternalIconManager.register({
+    'rte-paste': paste,
+  });
+})();
+RTEPasteChooserUI.CHOOSER_ATTR = 'data-rte-paste-chooser';
+RTEPasteChooserUI.CHOOSER_RICH_ATTR = 'data-rte-paste-type-rich';
+RTEPasteChooserUI.CHOOSER_TRIGGER_ATTR = 'data-rte-paste-trigger';
 
 /**
- * Default line height options used by the line-height extension when no
- * custom options are provided.
+ * Custom DataTransfer MIME type used to tag a synthetic paste with the chosen
+ * paste mode (e.g. 'rich' or 'plain'), so downstream paste handling can decide
+ * whether to preserve the original inline styles.
  */
-const VegaRTEDefaultLineHeightOptions = [
-  { title: '0.5', value: '0.5' },
-  { title: '1', value: '1' },
-  { title: '1.5', value: '1.5' },
-  { title: '2', value: '2' },
-  { title: '2.5', value: '2.5' },
-];
+const RTE_PASTE_MODE_DATA_TYPE = 'application/x-vega-rte-paste-mode';
 
-var RTELineHeightExtensionAnnotationTypeEnum;
-(function (RTELineHeightExtensionAnnotationTypeEnum) {
-  RTELineHeightExtensionAnnotationTypeEnum["LINE_HEIGHT"] = "LINE_HEIGHT";
-})(RTELineHeightExtensionAnnotationTypeEnum || (RTELineHeightExtensionAnnotationTypeEnum = {}));
 /**
- * Annotation to set block line height.
+ * Vega Rich Text Editor paste extension.
+ * Intercepts keyboard paste and allows users to choose paste mode.
  */
-class LineHeightAnnotation extends BlockAnnotation {
-  constructor(lineHeight) {
-    super();
-    this.type = RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT;
-    this.lineHeight = lineHeight;
+class VegaRTEPasteExtension extends VegaRTEExtension {
+  constructor() {
+    super(...arguments);
+    this.editableEl = null;
+    this.contentHostEl = null;
+    this.chooserUI = null;
+    this.pendingPastePayload = null;
+    this.listenerDocument = null;
+    this.listenerWindow = null;
+    /**
+     * Handles a native paste event by capturing the clipboard payload and
+     * rendering the paste-mode chooser.
+     *
+     * @param {ClipboardEvent} event Native clipboard paste event.
+     */
+    this.handlePasteEvent = (event) => {
+      var _a, _b;
+      const clipboardData = event.clipboardData;
+      if (!clipboardData) {
+        return;
+      }
+      // HTML is sanitized via DOMParser and ElementToDtoStrategyProcessor pipeline
+      const html = clipboardData.getData('text/html') || '';
+      const text = clipboardData.getData('text/plain') || '';
+      if (!html && !text) {
+        // Empty clipboard paste should not mutate editor content.
+        event.preventDefault();
+        event.stopPropagation();
+        return;
+      }
+      event.preventDefault();
+      event.stopPropagation();
+      const range = this.cloneCurrentSelectionRange();
+      const selectedNodes = ((_b = (_a = this.extensionContext) === null || _a === void 0 ? void 0 : _a.getSelectedNodes) === null || _b === void 0 ? void 0 : _b.call(_a)) || [];
+      this.pendingPastePayload = { html, text, range, selectedNodes: [...selectedNodes] };
+      this.renderPasteChooser(event);
+    };
+    /**
+     * Dismisses the chooser when a pointer interaction occurs outside of it.
+     *
+     * @param {Event} event Pointer event captured on the document.
+     */
+    this.handleOutsidePointerDown = (event) => {
+      if (!this.chooserUI) {
+        return;
+      }
+      const eventPath = typeof event.composedPath === 'function' ? event.composedPath() : [];
+      if (this.chooserUI.includesEventPath(eventPath)) {
+        return;
+      }
+      this.clearPasteChooser();
+    };
+    /**
+     * Dismisses the chooser when the Escape key is pressed.
+     *
+     * @param {KeyboardEvent} event Keyboard event captured on the document.
+     */
+    this.handleOutsideKeyDown = (event) => {
+      if (event.key === 'Escape') {
+        this.clearPasteChooser();
+      }
+    };
+    /**
+     * Dismisses the chooser when any relevant scroll container scrolls.
+     */
+    this.handleOutsideScroll = () => {
+      this.clearPasteChooser();
+    };
+  }
+  /** @inheritDoc */
+  initialExtensionAfterLoad(context) {
+    super.initialExtensionAfterLoad(context);
+    this.hostEl = context.host;
+    this.attachPasteListener();
+  }
+  /** @inheritDoc */
+  destroyExtension() {
+    this.detachPasteListener();
+    this.clearPasteChooser();
   }
   /**
-   * Generate the map item for the annotation.
-   *
-   * @param {string} lineHeight - Line height value.
-   * @returns {[RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT, LineHeightAnnotation]} Map item for the annotation.
+   * Attaches the paste listener to the editable element.
    */
-  static from(lineHeight) {
-    return [RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT, new LineHeightAnnotation(lineHeight)];
+  attachPasteListener() {
+    const { editableEl, contentHostEl, } = this.getEditorElements();
+    this.editableEl = editableEl;
+    this.contentHostEl = contentHostEl;
+    if (this.editableEl) {
+      this.editableEl.addEventListener('paste', this.handlePasteEvent);
+    }
   }
   /**
-   * Get the default standalone styles for a given line height value.
+   * Detaches the paste listener from the editable element.
+   */
+  detachPasteListener() {
+    if (this.editableEl) {
+      this.editableEl.removeEventListener('paste', this.handlePasteEvent);
+    }
+    this.editableEl = null;
+    this.contentHostEl = null;
+  }
+  /**
+   * Resolves the content host and editable element from the host shadow tree.
    *
-   * @param {string} lineHeight - The line height value.
-   * @returns {AnnotationStyle} The default standalone styles.
+   * @returns {EditorElements} Editor elements.
    */
-  static getDefaultStyles(lineHeight) {
-    return { lineHeight };
+  getEditorElements() {
+    var _a, _b, _c, _d, _e;
+    const contentHostEl = (_c = (_b = (_a = this.hostEl) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('vega-rich-text-content')) !== null && _c !== void 0 ? _c : null;
+    const editableEl = (_e = (_d = contentHostEl === null || contentHostEl === void 0 ? void 0 : contentHostEl.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector('.rich-text-content')) !== null && _e !== void 0 ? _e : null;
+    return { editableEl, contentHostEl };
   }
   /**
-   * Generate the JSON item of the annotation.
+   * Resolves the editable content element from the host shadow tree.
    *
-   * @returns {Record<string, unknown>} JSON representation of the annotation.
+   * @returns {HTMLDivElement | null} Editable element or `null` when unavailable.
    */
-  toJSON() {
-    return {
-      lineHeight: this.lineHeight,
-    };
+  getEditableElement() {
+    const { editableEl } = this.getEditorElements();
+    return editableEl;
   }
   /**
-   * @inheritDoc
+   * Clones the current selection range so it can be restored after the user
+   * chooses a paste mode.
+   *
+   * @returns {Range | null} Cloned range or `null` when there is no selection.
    */
-  renderClass() {
+  cloneCurrentSelectionRange() {
+    var _a;
+    const selection = (_a = this.extensionContext) === null || _a === void 0 ? void 0 : _a.getSelection();
+    if (selection && selection.rangeCount > 0) {
+      return selection.getRangeAt(0).cloneRange();
+    }
     return null;
   }
   /**
-   * @inheritDoc
+   * Renders the paste-mode chooser and wires up dismissal listeners.
+   *
+   * @param {ClipboardEvent} pasteEvent Originating paste event used for positioning.
    */
-  clone() {
-    return new LineHeightAnnotation(this.lineHeight);
+  renderPasteChooser(pasteEvent) {
+    var _a, _b;
+    const hostRoot = (_b = (_a = this.hostEl) === null || _a === void 0 ? void 0 : _a.shadowRoot) !== null && _b !== void 0 ? _b : null;
+    if (!hostRoot) {
+      return;
+    }
+    this.clearPasteChooser(false);
+    const position = this.computeChooserPosition(pasteEvent);
+    this.chooserUI = new RTEPasteChooserUI(hostRoot, {
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      onModeSelect: (mode) => {
+        this.applyPasteMode(mode);
+      },
+    });
+    this.chooserUI.open(position);
+    this.listenerDocument = this.hostEl.ownerDocument;
+    this.listenerWindow = this.listenerDocument.defaultView;
+    this.listenerDocument.addEventListener('mousedown', this.handleOutsidePointerDown, true);
+    this.listenerDocument.addEventListener('keydown', this.handleOutsideKeyDown, true);
+    this.listenerDocument.addEventListener('scroll', this.handleOutsideScroll, true);
+    if (this.listenerWindow) {
+      this.listenerWindow.addEventListener('scroll', this.handleOutsideScroll, true);
+    }
+    if (this.contentHostEl) {
+      this.contentHostEl.addEventListener('scroll', this.handleOutsideScroll);
+    }
   }
   /**
-   * @inheritDoc
+   * Computes the on-screen position for the chooser based on pointer or caret.
+   *
+   * @param {ClipboardEvent} event Originating paste event.
+   * @returns {ChooserPosition} Position in viewport coordinates.
    */
-  renderStyle() {
-    return LineHeightAnnotation.getDefaultStyles(this.lineHeight);
-  }
-}
-
-/**
- * Action to update block line height annotation.
- */
-class LineHeightAnnotationAction extends AnnotationAction {
-  constructor(lineHeight) {
-    super();
-    this.isFlushable = true;
-    this.lineHeight = lineHeight;
+  computeChooserPosition(event) {
+    var _a, _b, _c;
+    const hostRect = this.hostEl.getBoundingClientRect();
+    const viewportHeight = (_b = (_a = this.hostEl.ownerDocument.defaultView) === null || _a === void 0 ? void 0 : _a.innerHeight) !== null && _b !== void 0 ? _b : window.innerHeight;
+    const pointerEvent = event;
+    const hasPointer = typeof pointerEvent.clientX === 'number' &&
+      pointerEvent.clientX > 0 &&
+      typeof pointerEvent.clientY === 'number' &&
+      pointerEvent.clientY > 0;
+    // For keyboard-initiated paste (Command/Control+V) clientX/Y are 0, so anchor
+    // the chooser to the current caret instead of a fixed host-relative spot.
+    const caretRect = hasPointer ? null : this.getCaretRect();
+    const CHOOSER_GAP_PX = 8;
+    const CHOOSER_MIN_MARGIN_PX = 12;
+    const CHOOSER_WIDTH_PX = 220;
+    const CHOOSER_FALLBACK_OFFSET_PX = 40;
+    const CHOOSER_MIN_VISIBLE_BELOW_SPACE_PX = 88;
+    const baseLeft = hasPointer
+      ? pointerEvent.clientX
+      : (_c = caretRect === null || caretRect === void 0 ? void 0 : caretRect.left) !== null && _c !== void 0 ? _c : hostRect.left + CHOOSER_MIN_MARGIN_PX;
+    const baseTop = hasPointer
+      ? pointerEvent.clientY
+      : caretRect
+        ? caretRect.bottom
+        : hostRect.top + CHOOSER_FALLBACK_OFFSET_PX;
+    const maxLeft = Math.max(hostRect.left + CHOOSER_MIN_MARGIN_PX, hostRect.right - CHOOSER_WIDTH_PX);
+    const left = Math.min(Math.max(baseLeft, hostRect.left + CHOOSER_MIN_MARGIN_PX), maxLeft);
+    const top = Math.max(baseTop + CHOOSER_GAP_PX, hostRect.top + CHOOSER_MIN_MARGIN_PX);
+    const availableBelow = viewportHeight - top - CHOOSER_MIN_MARGIN_PX;
+    const availableAbove = top - CHOOSER_MIN_MARGIN_PX;
+    const placement = availableBelow >= CHOOSER_MIN_VISIBLE_BELOW_SPACE_PX || availableBelow >= availableAbove
+      ? ['bottom', 'top']
+      : ['top', 'bottom'];
+    return { left, top, placement };
+  }
+  /**
+   * Resolves the bounding rect of the pending caret position.
+   *
+   * @returns {DOMRect | null} Caret rect or `null` when it cannot be determined.
+   */
+  getCaretRect() {
+    var _a, _b;
+    const range = (_b = (_a = this.pendingPastePayload) === null || _a === void 0 ? void 0 : _a.range) !== null && _b !== void 0 ? _b : this.cloneCurrentSelectionRange();
+    if (!range) {
+      return null;
+    }
+    const rect = range.getBoundingClientRect();
+    if (this.isUnavailableRect(rect)) {
+      // eslint-disable-next-line spellcheck/spell-checker
+      const domRectList = range.getClientRects();
+      if (domRectList.length > 0) {
+        return domRectList[0];
+      }
+      return this.getRangeContainerRect(range);
+    }
+    return rect;
   }
   /**
-   * Converts the action to an annotation.
+   * Returns whether the browser could not resolve a meaningful caret rectangle.
    *
-   * @returns {LineHeightAnnotation} The annotation.
+   * @param {DOMRect} rect Candidate caret rect.
+   * @returns {boolean} Whether the rect is unusable.
    */
-  toAnnotation() {
-    return new LineHeightAnnotation(this.lineHeight);
+  isUnavailableRect(rect) {
+    return rect.width === 0 && rect.height === 0 && rect.left === 0 && rect.top === 0;
   }
-}
-
-/**
- * Update the block line height strategy.
- *
- * Registered for RTETextBlock and RTEListItemBlock, so the
- * target type is widened to the common RTEBlock base.
- */
-class BlockUpdateLineHeightStrategy extends ActionHandleStrategy {
   /**
-   * Updating the line height of a block requires cascading updates to the custom style.
+   * Falls back to the range container or neighbor child node bounds.
    *
-   * @param {LineHeightAnnotationAction} _action - The line height annotation action.
-   * @param {RTEBlock} target - The current block.
+   * @param {Range} range Caret/selection range.
+   * @returns {DOMRect | null} Best-effort caret anchor rectangle.
    */
-  handleAction(_action, target) {
-    this.updateCustomStyleAnnotation(target, ['lineHeight']);
+  getRangeContainerRect(range) {
+    var _a, _b, _c, _d, _e, _f;
+    const containerNode = (_a = range.startContainer) !== null && _a !== void 0 ? _a : null;
+    if (!containerNode) {
+      return null;
+    }
+    if (containerNode.nodeType === Node.ELEMENT_NODE) {
+      const containerElement = containerNode;
+      const previousNode = (_b = containerElement.childNodes[range.startOffset - 1]) !== null && _b !== void 0 ? _b : null;
+      const currentNode = (_c = containerElement.childNodes[range.startOffset]) !== null && _c !== void 0 ? _c : null;
+      return ((_e = (_d = this.getNodeRect(previousNode)) !== null && _d !== void 0 ? _d : this.getNodeRect(currentNode)) !== null && _e !== void 0 ? _e : this.getNodeRect(containerElement));
+    }
+    return (_f = this.getNodeRect(containerNode)) !== null && _f !== void 0 ? _f : this.getNodeRect(containerNode.parentNode);
   }
-}
-
-const lineHeight = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor"  d="M113.8 39.9c-4.6-5.1-11-7.9-17.8-7.9s-13.3 2.9-17.8 7.9l-72 80c-8.9 9.9-8.1 25 1.8 33.9s25 8.1 33.9-1.8L72 118.5V393.5L41.8 359.9c-8.9-9.9-24-10.7-33.9-1.8s-10.7 24-1.8 33.9l72 80c4.6 5.1 11 7.9 17.8 7.9s13.3-2.9 17.8-7.9l72-80c8.9-9.9 8.1-25-1.8-33.9s-25-8.1-33.9 1.8L120 393.5V118.5l30.2 33.5c8.9 9.9 24 10.7 33.9 1.8s10.7-24 1.8-33.9l-72-80zM248 72c-13.3 0-24 10.7-24 24s10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248zm0 160c-13.3 0-24 10.7-24 24s10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248zM224 416c0 13.3 10.7 24 24 24H552c13.3 0 24-10.7 24-24s-10.7-24-24-24H248c-13.3 0-24 10.7-24 24z"/></svg>`,
-};
-
-/**
- * Renderer for the line-height toolbar button in the Vega Rich Text Editor.
- */
-class RTELineHeightToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
-  constructor(options) {
-    super();
-    this.options = options;
+  /**
+   * Returns an element-backed rectangle from a DOM node.
+   *
+   * @param {Node | null} node Candidate node.
+   * @returns {DOMRect | null} Node rectangle when resolvable.
+   */
+  getNodeRect(node) {
+    var _a, _b;
+    if (!node) {
+      return null;
+    }
+    if (node.nodeType === Node.TEXT_NODE) {
+      return (_b = (_a = node.parentElement) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) !== null && _b !== void 0 ? _b : null;
+    }
+    if (node.nodeType === Node.ELEMENT_NODE) {
+      const rect = node.getBoundingClientRect();
+      return this.isUnavailableRect(rect) ? null : rect;
+    }
+    return null;
   }
   /**
-   * @inheritDoc
+   * Applies the chosen paste mode by dispatching a synthetic paste input event.
+   *
+   * @param {PasteMode} mode Selected paste mode.
    */
-  render(createElement, editorContext) {
-    const dropdownItems = this.options.map((item) => {
-      var _a;
-      return ({
-        key: item.value,
-        label: (_a = item.title) !== null && _a !== void 0 ? _a : item.value,
-      });
-    });
-    return this.renderDropdown(createElement, editorContext, {
-      selectType: 'single',
-      selectedSourceKey: this.getSelectedSourceValue(editorContext),
-    }, [
-      this.renderButton(createElement, editorContext, {
-        icon: 'line-height',
-        showArrowIcon: true,
-        tooltip: { text: VegaInternalTranslation.t('Line Height') },
-      }),
-      this.renderDropdownListTemplate(createElement, dropdownItems, editorContext),
-    ]);
+  applyPasteMode(mode) {
+    var _a;
+    if (!this.pendingPastePayload) {
+      this.clearPasteChooser();
+      return;
+    }
+    const editableEl = (_a = this.editableEl) !== null && _a !== void 0 ? _a : this.getEditableElement();
+    if (!editableEl) {
+      this.clearPasteChooser();
+      return;
+    }
+    editableEl.focus();
+    this.restoreSelectionRange(this.pendingPastePayload.range);
+    this.restoreSelectionControllerState(this.pendingPastePayload);
+    const dataTransfer = this.createDataTransfer(this.pendingPastePayload.html, this.pendingPastePayload.text, mode);
+    this.dispatchBeforeInputPaste(editableEl, dataTransfer);
+    this.clearPasteChooser();
   }
   /**
-   * @inheritDoc
+   * Restores SelectionController state from the captured selection so synthetic
+   * beforeinput paste can replace the selected content instead of appending.
+   *
+   * @param {PendingPastePayload} payload Pending paste payload.
    */
-  isSelected() {
-    return false;
+  restoreSelectionControllerState(payload) {
+    if (!payload.range || !this.extensionContext) {
+      return;
+    }
+    const rangeOptions = {
+      startNode: payload.range.startContainer,
+      endNode: payload.range.endContainer,
+      startOffset: payload.range.startOffset,
+      endOffset: payload.range.endOffset,
+    };
+    this.extensionContext.setSelectedNodes(payload.selectedNodes || [], rangeOptions);
   }
   /**
-   * @inheritDoc
+   * Restores a previously cloned selection range.
+   *
+   * @param {Range | null} range Range to restore.
    */
-  isDisabled(editorContext) {
+  restoreSelectionRange(range) {
     var _a;
-    if (editorContext.host.disabled) {
-      return true;
+    if (!range) {
+      return;
     }
-    const extensionContext = this.getExtensionContext(editorContext.host);
-    const selectedNodes = (_a = extensionContext === null || extensionContext === void 0 ? void 0 : extensionContext.getSelectedNodes()) !== null && _a !== void 0 ? _a : [];
-    if (selectedNodes.some((node) => {
-      var _a;
-      return ((_a = node.getAnnotationByType(NodeAnnotationTypeEnum.CODE)) === null || _a === void 0 ? void 0 : _a.code) ||
-        node.parent instanceof RTECodeBlock;
-    })) {
-      return true;
+    const selection = (_a = this.extensionContext) === null || _a === void 0 ? void 0 : _a.getSelection();
+    if (selection) {
+      selection.removeAllRanges();
+      selection.addRange(range);
     }
-    const selectedBlocks = this.getSelectedBlocks(editorContext);
-    return selectedBlocks.some((block) => block instanceof RTECodeBlock ||
-      block instanceof RTEImageBlock ||
-      !ActionHandleStrategyRegistry.canHandle(LineHeightAnnotationAction.name, block));
   }
   /**
-   * @inheritDoc
+   * Dispatches a synthetic `beforeinput` paste event into the editor pipeline.
+   *
+   * @param {HTMLDivElement} editableEl Editable content element.
+   * @param {DataTransfer} dataTransfer Clipboard payload for the paste.
    */
-  handleDropdownClick(itemValue, editorContext) {
-    const selectedLineHeight = itemValue;
-    const selectedBlocks = this.getSelectedBlocks(editorContext);
-    selectedBlocks.forEach((block) => {
-      block.apply(new LineHeightAnnotationAction(selectedLineHeight));
+  dispatchBeforeInputPaste(editableEl, dataTransfer) {
+    // This synthetic beforeinput event intentionally reuses the existing
+    // UserInputController -> insertFromPaste -> InsertPasteHandler pipeline.
+    const beforeInputEvent = new CustomEvent('beforeinput', {
+      bubbles: true,
+      cancelable: true,
     });
+    try {
+      Object.defineProperties(beforeInputEvent, {
+        inputType: {
+          value: 'insertFromPaste',
+          configurable: true,
+        },
+        dataTransfer: {
+          value: dataTransfer,
+          configurable: true,
+        },
+      });
+    }
+    catch (_a) {
+      Object.assign(beforeInputEvent, {
+        inputType: 'insertFromPaste',
+        dataTransfer,
+      });
+    }
+    editableEl.dispatchEvent(beforeInputEvent);
   }
   /**
-   * Handle direct toolbar button click.
-   */
-  handleButtonClick() {
-    // No direct click action; selection happens in dropdown options.
-  }
-  /**
-   * Get the selected line-height key for dropdown selection state.
+   * Builds a `DataTransfer` payload carrying the paste content and mode marker.
    *
-   * @param {VegaRTEToolbarRenderContext} editorContext - Current toolbar context.
-   * @returns {string} Selected line-height key or empty string for mixed/none.
+   * @param {string} html HTML clipboard content.
+   * @param {string} text Plain text clipboard content.
+   * @param {PasteMode} [mode] Selected paste mode marker.
+   * @returns {DataTransfer} Populated data transfer payload.
    */
-  getSelectedSourceValue(editorContext) {
-    const selectedBlocks = this.getSelectedBlocks(editorContext);
-    if (selectedBlocks.length === 0) {
-      return '';
+  createDataTransfer(html, text, mode) {
+    if (typeof DataTransfer !== 'undefined') {
+      const dataTransfer = new DataTransfer();
+      if (html) {
+        dataTransfer.setData('text/html', html);
+      }
+      if (text) {
+        dataTransfer.setData('text/plain', text);
+      }
+      if (mode) {
+        dataTransfer.setData(RTE_PASTE_MODE_DATA_TYPE, mode);
+      }
+      return dataTransfer;
     }
-    const firstAnnotation = selectedBlocks[0].getAnnotationByType(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
-    const isSameLineHeight = selectedBlocks.every((block) => {
-      const annotation = block.getAnnotationByType(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
-      return (annotation === null || annotation === void 0 ? void 0 : annotation.lineHeight) === (firstAnnotation === null || firstAnnotation === void 0 ? void 0 : firstAnnotation.lineHeight);
-    });
-    return isSameLineHeight && firstAnnotation ? firstAnnotation.lineHeight : '';
+    return {
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      getData: (type) => {
+        if (type === 'text/html') {
+          return html;
+        }
+        if (type === 'text/plain') {
+          return text;
+        }
+        if (type === RTE_PASTE_MODE_DATA_TYPE) {
+          return mode !== null && mode !== void 0 ? mode : '';
+        }
+        return '';
+      },
+    };
   }
   /**
-   * Resolve selected blocks from selected nodes with range fallback.
+   * Tears down the chooser UI and removes dismissal listeners.
    *
-   * @param {VegaRTEToolbarRenderContext} editorContext - Current toolbar context.
-   * @returns {RTEBlock[]} Selected blocks.
+   * @param {boolean} [clearPayload] Whether to also clear the pending payload.
    */
-  getSelectedBlocks(editorContext) {
-    var _a, _b;
-    const extensionContext = this.getExtensionContext(editorContext.host);
-    const selectedNodes = (_a = extensionContext === null || extensionContext === void 0 ? void 0 : extensionContext.getSelectedNodes()) !== null && _a !== void 0 ? _a : [];
-    const selectedBlocks = [];
-    selectedNodes.forEach((node) => {
-      if (node.parent instanceof RTEBlock && !selectedBlocks.includes(node.parent)) {
-        selectedBlocks.push(node.parent);
-      }
-    });
-    if (selectedBlocks.length === 0 && ((_b = editorContext.rteRange.startNode) === null || _b === void 0 ? void 0 : _b.parent) instanceof RTEBlock) {
-      selectedBlocks.push(editorContext.rteRange.startNode.parent);
+  clearPasteChooser(clearPayload = true) {
+    if (this.contentHostEl) {
+      this.contentHostEl.removeEventListener('scroll', this.handleOutsideScroll);
+    }
+    if (this.listenerWindow) {
+      this.listenerWindow.removeEventListener('scroll', this.handleOutsideScroll, true);
+      this.listenerWindow = null;
+    }
+    if (this.listenerDocument) {
+      this.listenerDocument.removeEventListener('mousedown', this.handleOutsidePointerDown, true);
+      this.listenerDocument.removeEventListener('keydown', this.handleOutsideKeyDown, true);
+      this.listenerDocument.removeEventListener('scroll', this.handleOutsideScroll, true);
+      this.listenerDocument = null;
+    }
+    if (this.chooserUI) {
+      this.chooserUI.destroy();
+    }
+    this.chooserUI = null;
+    if (clearPayload) {
+      this.pendingPastePayload = null;
     }
-    return selectedBlocks;
   }
 }
-(() => {
-  VegaInternalIconManager.register({
-    'line-height': lineHeight,
-  });
-})();
 
-const LINE_HEIGHT_AWARE_BLOCK_NAMES = new Set([
-  RTETextBlock.name,
-  RTEListItemBlock.name,
-]);
-/** Handle line height annotation. */
-class LineHeightAnnotationHandler extends AnnotationGeneratorStrategyAbstract {
-  constructor(options = VegaRTEDefaultLineHeightOptions) {
+/**
+ * Action to extract the currently selected content (HTML and plain text) from the editor.
+ *
+ * The action is read-only: it does not mutate the content state. The handling strategy resolves
+ * the selected HTML and plain text and writes them directly to the clipboard.
+ *
+ * @example host.value.apply(new CopySelectedContentAction(selection, selectedNodes));
+ */
+class CopySelectedContentAction extends ModifyContentAction {
+  constructor(selection, selectedNodes) {
     super();
-    this.allowedLineHeights = new Set(options.map((option) => option.value));
+    this.type = 'COPY_SELECTED_CONTENT_ACTION';
+    this.selection = null;
+    this.selectedNodes = [];
+    // The result of the copy operation, which may be a Promise if the clipboard write is asynchronous.
+    this.copyResult = null;
+    this.selection = selection;
+    this.selectedNodes = selectedNodes;
+  }
+}
+
+/**
+ * Toolbar button renderer for the Copy extension.
+ * Renders a toolbar button that copies the currently selected editor text to the clipboard.
+ */
+class RTECopyToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  /**
+   * Renders the copy toolbar button.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @returns {VegaRTERenderResult} - The toolbar button render result.
+   */
+  render(h, editorContext) {
+    return this.renderButton(h, editorContext, {
+      icon: 'rte-copy',
+      tooltip: { text: 'Copy' },
+    });
   }
   /**
-   * Can be handled.
+   * Determines if the copy button should be disabled.
+   * Disabled when the editor is disabled or when no content is selected.
    *
-   * @param {RTEDtoClassPrototype} targetDto - Target DTO.
-   * @returns {boolean} Whether the target DTO supports line-height annotations.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @returns {boolean} - True if the button should be disabled.
    */
-  canHandle(targetDto) {
-    return LINE_HEIGHT_AWARE_BLOCK_NAMES.has(targetDto.name);
+  isDisabled(editorContext) {
+    const context = this.getExtensionContext(editorContext.host);
+    return (!context || context.host.disabled || !context.getSelection() || context.getSelection().isCollapsed);
   }
   /**
-   * Extract inline `line-height` as a semantic `lineHeight` annotation.
+   * Handles the copy button click event.
+   * Dispatches a copy action through `host.value`; the action handler extracts the current selection
+   * and writes the resulting HTML and plain text content to the clipboard.
    *
-   * @param {HTMLElement} [element] - Current element.
-   * @returns {VegaRTEBlockAnnotations} `{ lineHeight }` when present, otherwise `{}`.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
    */
-  handle(element) {
-    var _a, _b;
-    const lineHeight = (_b = (_a = element === null || element === void 0 ? void 0 : element.style.lineHeight) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
-    if (!lineHeight) {
-      return {};
-    }
-    if (!this.allowedLineHeights.has(lineHeight)) {
-      return {};
+  handleButtonClick(editorContext) {
+    const context = this.getExtensionContext(editorContext.host);
+    if (context && context.host) {
+      context.host.value.apply(new CopySelectedContentAction(context.getSelection(), context.getSelectedNodes()));
     }
-    return { lineHeight };
+  }
+  /*istanbul ignore next*/
+  /**
+   * Handles dropdown click event. Not applicable for the copy button, so it's left empty.
+   */
+  handleDropdownClick() {
   }
 }
+(() => {
+  VegaInternalIconManager.register({ 'rte-copy': copy });
+})();
 
 /**
- * Removes a redundant inline `customStyle.lineHeight` when it duplicates the
- * semantic `lineHeight` annotation during HTML-to-DTO conversion.
- *
- * Note: moving out-of-list line-height values from the semantic annotation to
- * `customStyle.lineHeight` is handled by the per-host interceptor in
- * `line-height-host-interceptor.ts`, not here.
+ * Strategy that extracts the HTML and plain text content of the current selection, stores the
+ * result on the {@link CopySelectedContentAction} and writes it to the clipboard.
  */
-class LineHeightFilterStylesStrategy extends RTEFilterStylesStrategy {
-  constructor() {
-    super(...arguments);
-    this.stylesToBeFiltered = {};
+class CopySelectedContentStrategy extends ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(action) {
+    const parentBlocks = this.getParentBlocks(action.selectedNodes);
+    const { html, text } = this.getSelectedContent(action.selection, parentBlocks);
+    if (text || html) {
+      action.copyResult = this.copyToClipboard(html, text);
+    }
+  }
+  /**
+   * Extracts the HTML and text content from the current selection.
+   *
+   * `Range.cloneContents()` returns only the nodes inside the selection, dropping the ancestor chain
+   * between the selection's common ancestor and its block. When the selection stays inside a single
+   * block, those dropped ancestors carry the styling, so the cloned fragment is re-wrapped with
+   * shallow clones of every ancestor from the common ancestor up to the block, preserving arbitrary
+   * inline nesting (e.g. `block > strong > em > span > text`).
+   *
+   * When the selection covers the whole block (its common ancestor sits above the block) or spans
+   * multiple blocks, each block is already kept by `cloneContents()`, so no re-wrapping is done.
+   *
+   * @param {Nullable<Selection>} selection - The current selection object.
+   * @param {RTEBlock[]} parentBlocks - The parent blocks of the selected nodes.
+   * @returns {RTESelectedContent} - The HTML and text content of the selected content.
+   */
+  getSelectedContent(selection, parentBlocks) {
+    const result = { html: '', text: '' };
+    if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
+      return result;
+    }
+    const range = selection.getRangeAt(0);
+    const doc = tryGetDocument();
+    if (!doc) {
+      return result;
+    }
+    // `cloneContents()` returns a `DocumentFragment` of real DOM nodes (already well-formed). Its
+    // `textContent` is the plain text; the fragment itself is wrapped/serialized into HTML below.
+    const fragment = range.cloneContents();
+    // A `DocumentFragment` has no `innerHTML`, so a temporary element is used to serialize it to HTML.
+    const container = doc.createElement('div');
+    const commonAncestor = range.commonAncestorContainer;
+    if (parentBlocks.length === 1) {
+      const block = this.getDOMByEntity(parentBlocks[0]);
+      // Only re-wrap when the block is dropped from the clone, i.e. the selection stays inside the
+      // block. When the whole block is selected, `commonAncestor` sits above it and the clone
+      // already keeps the block, so wrapping again would nest a duplicate block.
+      if (block && block.contains(commonAncestor)) {
+        // Wrap the cloned fragment with the dropped ancestor chain (from `commonAncestor` up to the
+        // block), preserving each element's styles, then serialize the rebuilt block to HTML.
+        const cloneNode = this.wrapWithAncestorChain(fragment, commonAncestor, block);
+        container.appendChild(cloneNode);
+        result.html = container.innerHTML;
+        result.text = container.textContent;
+        return result;
+      }
+    }
+    else if (parentBlocks.length > 1 &&
+      parentBlocks.every((block) => block.type === 'list-item')) {
+      const firstList = parentBlocks[0].parent;
+      if (firstList && parentBlocks.every((block) => block.parent === firstList)) {
+        const listElement = this.getDOMByEntity(firstList);
+        if (listElement && listElement.contains(commonAncestor)) {
+          const cloneListElement = listElement.cloneNode(false);
+          cloneListElement.appendChild(fragment);
+          container.appendChild(cloneListElement);
+          result.html = container.innerHTML;
+          result.text = container.textContent;
+          return result;
+        }
+      }
+    }
+    // The selection covers whole/multiple blocks: the clone already keeps them, so serialize as-is.
+    container.appendChild(fragment);
+    result.html = container.innerHTML;
+    result.text = container.textContent;
+    return result;
   }
   /**
-   * Always run this strategy, even when autoMatchFormat is disabled.
+   * Wraps the cloned selection fragment with the ancestor chain that `cloneContents()` dropped,
+   * rebuilding every element from the selection's common ancestor up to the block while preserving
+   * each element's styles. Returns the cloned block that holds the rebuilt chain and content.
+   *
+   * When the common ancestor is the block itself, the fragment is appended directly under the cloned
+   * block, since no inline ancestor chain was dropped.
+   *
+   * @param {Node} content - The cloned selection fragment to place at the innermost level.
+   * @param {Node} commonAncestor - The selection's common ancestor container.
+   * @param {HTMLElement} block - The block element to stop cloning at.
+   * @returns {HTMLElement} - The cloned block wrapping the rebuilt ancestor chain and content.
+   */
+  wrapWithAncestorChain(content, commonAncestor, block) {
+    const blockClone = block.cloneNode(false);
+    // `cloneContents()` keeps everything inside `commonAncestor`, so the dropped chain runs from
+    // `commonAncestor` (its element, when the ancestor is a text node) up to the block.
+    const targetElement = commonAncestor.nodeType === Node.TEXT_NODE
+      ? commonAncestor.parentElement
+      : commonAncestor;
+    // The target is the block itself: the content sits directly under the block, no chain to rebuild.
+    if (targetElement === block) {
+      blockClone.appendChild(content);
+      return blockClone;
+    }
+    // Clone the target as the innermost container and place the content inside it.
+    const innermost = targetElement.cloneNode(false);
+    innermost.appendChild(content);
+    // Walk up from the target to the block, cloning each ancestor and nesting the chain bottom-up.
+    let shouldAppendNode = innermost;
+    let current = targetElement.parentElement;
+    while (current && current !== block) {
+      const parentClone = current.cloneNode(false);
+      parentClone.appendChild(shouldAppendNode);
+      shouldAppendNode = parentClone;
+      current = current.parentElement;
+    }
+    // Append the assembled ancestor chain to the cloned block.
+    blockClone.appendChild(shouldAppendNode);
+    // When the block is a list item inside an ordered list, wrap the cloned list item with a
+    // shallow clone of the ordered list to preserve the numbering.
+    if (blockClone.tagName === 'LI' &&
+      current &&
+      current.parentElement &&
+      current.parentElement.tagName === 'OL') {
+      const cloneList = current.parentElement.cloneNode(false);
+      cloneList.appendChild(blockClone);
+      return cloneList;
+    }
+    return blockClone;
+  }
+  /**
+   * Retrieves the parent blocks of the given selected nodes.
+   *
+   * @param {RTENode[]} selectedNodes - The nodes for which to find parent blocks.
+   * @returns {RTEBlock[]} An array of parent blocks.
+   */
+  getParentBlocks(selectedNodes) {
+    const parentBlocks = [];
+    for (const node of selectedNodes) {
+      const block = node.parent;
+      if (block && !parentBlocks.includes(block)) {
+        parentBlocks.push(block);
+      }
+    }
+    return parentBlocks;
+  }
+  /**
+   * Copies both HTML and plain text content to the clipboard using the Clipboard API.
    *
-   * @returns {boolean} Always true.
+   * Browser compatibility for `navigator.clipboard.write()` with `ClipboardItem`:
+   * - Chrome 76+, Edge 79+, Safari 13.1+, Firefox 127+
+   *
+   * Since Firefox 86+ must be supported, fall back to `execCommand('copy')` when the
+   * Clipboard API is unavailable or fails (e.g. Firefox 86-126).
+   *
+   * @param {string} htmlContent - The HTML content to copy.
+   * @param {string} textContent - The plain text content to copy.
+   * @returns {Promise<boolean>} - A promise that resolves to true if the copy operation succeeded.
    */
-  get alwaysFilter() {
-    return true;
+  async copyToClipboard(htmlContent, textContent) {
+    let result = false;
+    try {
+      const htmlBlob = new Blob([htmlContent], { type: 'text/html' });
+      const textBlob = new Blob([textContent], { type: 'text/plain' });
+      const clipboardItem = new ClipboardItem({
+        'text/html': htmlBlob,
+        'text/plain': textBlob,
+      });
+      await navigator.clipboard.write([clipboardItem]);
+      result = true;
+    }
+    catch (_a) {
+      // Fallback for browsers without ClipboardItem support (e.g. Firefox 86-126)
+      result = this.copyWithExecCommand(htmlContent, textContent);
+      if (!result) {
+        LogUtility.warn('Failed to copy the selected content to the clipboard. Use keyboard shortcuts instead.');
+      }
+    }
+    return result;
   }
   /**
-   * Drop `customStyle.lineHeight` when it duplicates the semantic `lineHeight`.
+   * Fallback copy method using `execCommand('copy')` for browsers that don't support the
+   * Clipboard API (e.g. Firefox 86-126).
    *
-   * @param {VegaRTEAnnotations} annotations - The annotations to filter.
-   * @returns {VegaRTEAnnotations} The same annotations reference.
+   * Instead of creating a temporary element and changing the selection (which would clear the
+   * editor's Shadow DOM selection and steal focus), this intercepts the native `copy` event that
+   * `execCommand('copy')` triggers and overrides its clipboard data. The user's original selection
+   * and focus stay untouched.
+   *
+   * @param {string} htmlContent - The HTML content to copy.
+   * @param {string} textContent - The plain text content to copy.
+   * @returns {boolean} - True if the copy command succeeded.
    */
-  filterAnnotations(annotations) {
-    const blockAnnotations = annotations;
-    const lineHeight = blockAnnotations.lineHeight;
-    const customStyle = blockAnnotations.customStyle;
-    if (lineHeight && customStyle && customStyle.lineHeight === lineHeight) {
-      delete customStyle.lineHeight;
+  copyWithExecCommand(htmlContent, textContent) {
+    const doc = tryGetDocument();
+    if (!doc) {
+      return false;
     }
-    if (customStyle && Object.keys(customStyle).length === 0) {
-      delete blockAnnotations.customStyle;
+    /**
+     * Overrides the clipboard data of the native copy event triggered by `execCommand('copy')`.
+     *
+     * @param {ClipboardEvent} event - The native copy event.
+     */
+    const onCopy = (event) => {
+      if (event.clipboardData) {
+        event.clipboardData.setData('text/html', htmlContent);
+        event.clipboardData.setData('text/plain', textContent);
+      }
+      event.preventDefault();
+    };
+    doc.addEventListener('copy', onCopy);
+    try {
+      return doc.execCommand('copy');
+    }
+    finally {
+      doc.removeEventListener('copy', onCopy);
     }
-    return annotations;
   }
 }
 
 /**
- * Per-class set of allowed line-height values, updated as extension instances
- * are constructed with (possibly custom) options.
- */
-const allowedLineHeightsByClass = new WeakMap();
-/**
- * Tracks which block classes have had their JSON `lineHeight` annotation
- * handler installed, so we register it exactly once per class.
- */
-const handlerInstalledClasses = new WeakSet();
-/**
- * Move an out-of-range `lineHeight` annotation into `customStyle.lineHeight`.
- *
- * @param {RTEBlock} block - The block to inspect.
- * @param {ReadonlySet<string>} allowed - Allowed line-height values.
+ * Vega Rich Text Editor Copy Extension.
+ * Adds a toolbar button that copies the currently selected editor content to the clipboard.
  */
-function normalizeLineHeightStyle(block, allowed) {
-  const annotation = block.annotationMap.get(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
-  if (!annotation || allowed.has(annotation.lineHeight)) {
-    return;
-  }
-  const value = annotation.lineHeight;
-  block.annotationMap.delete(RTELineHeightExtensionAnnotationTypeEnum.LINE_HEIGHT);
-  const existing = block.annotationMap.get(CommonAnnotationTypeEnum.CUSTOM_STYLE);
-  if (existing) {
-    existing.customStyle = Object.assign(Object.assign({}, existing.customStyle), { lineHeight: value });
-  }
-  else {
-    block.annotationMap.set(...CustomStyleAnnotation.from({ lineHeight: value }));
+class VegaRTECopyExtension extends VegaRTEExtension {
+  /** @inheritDoc */
+  prepareBeforeLoad(host) {
+    this.registerToolbarButtonRenderer(VegaRTECopyExtension.TOOLBAR_BUTTON_KEY, new RTECopyToolbarButtonRenderer(), host);
   }
 }
+(() => {
+  ActionHandleStrategyRegistry.register('COPY_SELECTED_CONTENT_ACTION', VegaRTEContent.name, new CopySelectedContentStrategy());
+})();
+// The unique key for the copy toolbar button, used for registration and retrieval.
+VegaRTECopyExtension.TOOLBAR_BUTTON_KEY = 'copy';
+
+const cutIcon = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2026 Fonticons, Inc. --><path fill="currentColor" d="M48 112a64 64 0 1 1 128 0 64 64 0 1 1 -128 0zm176 0C224 50.1 173.9 0 112 0S0 50.1 0 112 50.1 224 112 224c24 0 46.3-7.6 64.5-20.4l57.3 52.4-57.3 52.4C158.3 295.6 136 288 112 288 50.1 288 0 338.1 0 400s50.1 112 112 112 112-50.1 112-112c0-20.5-5.5-39.6-15.1-56.2L504.2 73.7c9.8-8.9 10.5-24.1 1.5-33.9s-24.1-10.5-33.9-1.5l-202.4 185.2-60.5-55.3c9.6-16.5 15.1-35.7 15.1-56.2zM471.8 473.7c9.8 8.9 25 8.3 33.9-1.5s8.3-25-1.5-33.9L338.6 286.8 302.7 319 471.8 473.7zM48 400a64 64 0 1 1 128 0 64 64 0 1 1 -128 0z"/></svg>`,
+};
+
 /**
- * Install the JSON `lineHeight` annotation handler for a block class.
+ * Delete the currently selected content from the editor.
  *
- * @param {LineHeightBlockClass} BlockClass - Target block class.
+ * @example currentVegaRTEContent.apply(new DeleteSelectedContentAction(host, mergeFlag))
  */
-function attachLineHeightFromJson(BlockClass) {
-  if (handlerInstalledClasses.has(BlockClass)) {
-    return;
+class DeleteSelectedContentAction extends ModifyContentAction {
+  constructor(host, mergeFlag, flushable = false) {
+    super();
+    this.type = ModifyContentActionType.DELETE_SELECTED_CONTENT;
+    // mergeFlag indicates whether the action should merge adjacent text nodes after deletion.
+    this.mergeFlag = false;
+    this.host = host;
+    this.mergeFlag = mergeFlag;
+    this.isFlushable = flushable;
   }
-  handlerInstalledClasses.add(BlockClass);
-  VegaRTEExtension.attachAnnotationFromJson(BlockClass, 'lineHeight', (instance, value) => {
-    if (typeof value !== 'string' || value === '') {
-      return;
-    }
-    instance.annotationMap.set(...LineHeightAnnotation.from(value));
-    const allowed = allowedLineHeightsByClass.get(BlockClass);
-    if (allowed && allowed.size > 0) {
-      normalizeLineHeightStyle(instance, allowed);
-    }
-  });
-}
-/**
- * Update the set of allowed line-height values for a block class.
- *
- * @param {LineHeightBlockClass} BlockClass - Target block class.
- * @param {VegaRTELineHeightOption[]} options - Allowed line-height options.
- */
-function setAllowedLineHeights(BlockClass, options) {
-  allowedLineHeightsByClass.set(BlockClass, new Set(options.map((option) => option.value)));
 }
 
 /**
- * Rich Text Editor extension that adds configurable line-height support
- * (toolbar control, annotations, content transforms, and JSON parsing).
+ * Toolbar button renderer for the Cut extension.
+ * Reuses the Copy renderer to write the selected editor content to the clipboard,
+ * then removes the selected content from the editor.
  */
-class VegaRTELineHeightExtension extends VegaRTEExtension {
-  constructor(options = VegaRTEDefaultLineHeightOptions) {
-    super();
-    this.options = options;
-    this.toolbarButtonRenderer = null;
-    this.registerAnnotationHandler(new LineHeightAnnotationHandler(this.options));
-    [RTETextBlock, RTEListItemBlock].forEach((BlockClass) => {
-      setAllowedLineHeights(BlockClass, this.options);
+class RTECutToolbarButtonRenderer extends RTECopyToolbarButtonRenderer {
+  /**
+   * Renders the cut toolbar button.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @returns {VegaRTERenderResult} - The toolbar button render result.
+   */
+  render(h, editorContext) {
+    return this.renderButton(h, editorContext, {
+      icon: 'rte-cut',
+      tooltip: { text: 'Cut' },
     });
   }
   /**
-   * Register the per-host toolbar renderer so each editor on the page gets
-   * its own isolated line-height renderer instance.
+   * Handles the cut button click event.
+   * Copies the current editor selection to the clipboard and then deletes it from the editor.
    *
-   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
-   * @param {HTMLVegaRichTextEditorElement} host - The host element.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
    */
-  prepareBeforeLoad(host) {
-    this.toolbarButtonRenderer = new RTELineHeightToolbarButtonRenderer(this.options);
-    this.registerToolbarButtonRenderer('lineHeight', this.toolbarButtonRenderer, host);
+  async handleButtonClick(editorContext) {
+    const context = this.getExtensionContext(editorContext.host);
+    if (context && context.host) {
+      const { host } = context;
+      const copySelectedContentAction = new CopySelectedContentAction(context.getSelection(), context.getSelectedNodes());
+      host.value.apply(copySelectedContentAction);
+      const isCopySuccessful = await copySelectedContentAction.copyResult;
+      isCopySuccessful && host.value.apply(new DeleteSelectedContentAction(host, true, true));
+    }
   }
 }
 (() => {
-  [RTETextBlock, RTEListItemBlock].forEach((BlockClass) => {
-    VegaRTEExtension.registerActionHandleStrategy(BlockClass.name, LineHeightAnnotationAction.name, new BlockUpdateLineHeightStrategy());
-    RTEFilterStylesStrategyRegistry.register(BlockClass.name, new LineHeightFilterStylesStrategy());
-    attachLineHeightFromJson(BlockClass);
-  });
+  VegaInternalIconManager.register({ 'rte-cut': cutIcon });
 })();
 
+/**
+ * Vega Rich Text Editor Cut Extension.
+ * Adds a toolbar button that copies the currently selected editor content to the clipboard
+ * and removes it from the editor.
+ */
+class VegaRTECutExtension extends VegaRTEExtension {
+  /** @inheritDoc */
+  prepareBeforeLoad(host) {
+    this.registerToolbarButtonRenderer(VegaRTECutExtension.TOOLBAR_BUTTON_KEY, new RTECutToolbarButtonRenderer(), host);
+  }
+}
+// The unique key for the cut toolbar button, used for registration and retrieval.
+VegaRTECutExtension.TOOLBAR_BUTTON_KEY = 'cut';
+
 /**
  * Insert a new children to the nearest position of the parent container
  *
@@ -8956,7 +11828,7 @@ class VegaRTETokenExtension extends VegaRTEExtension {
   }
   /** @inheritDoc */
   prepareBeforeLoad(host) {
-    this.registerToolbarButtonRenderer('token', new RTETokenToolbarButtonRenderer(this.tokenList), host);
+    this.registerToolbarButtonRenderer(VegaRTETokenExtension.TOOLBAR_BUTTON_KEY, new RTETokenToolbarButtonRenderer(this.tokenList), host);
   }
 }
 (() => {
@@ -8964,5 +11836,6 @@ class VegaRTETokenExtension extends VegaRTEExtension {
   VegaRTEExtension.registerActionHandleStrategy(RTETextBlock.name, 'INSERT_TOKEN_NODE', insertTokenNodeStrategy);
   VegaRTEExtension.registerActionHandleStrategy(RTEListItemBlock.name, 'INSERT_TOKEN_NODE', insertTokenNodeStrategy);
 })();
+VegaRTETokenExtension.TOOLBAR_BUTTON_KEY = 'token';
 
-export { ActionHandlerInterceptor as A, InsertNodeToNearestRootAction as I, RTETokenToolbarButtonRenderer as R, VegaLoader as V, VegaNotify as a, VegaEventManager$1 as b, VegaZIndexManager$1 as c, VegaSkeletonLoader as d, VegaTranslation as e, VegaRTETokenExtension as f, VegaRTELanguageExtension as g, VegaRTEDefaultLineHeightOptions as h, VegaRTEFunctionExtension as i, VegaRTETableExtension as j, VegaRTEHorizontalLineExtension as k, VegaRTESpecialCharactersExtension as l, VegaRTESpecialCharactersEssentials as m, VegaRTESpecialCharactersLatin as n, VegaRTESpecialCharactersMathematical as o, VegaRTESpecialCharactersArrows as p, VegaRTESpecialCharactersCurrency as q, VegaRTESpecialCharactersText as r, VegaRTELineHeightExtension as s, VegaCalendarPeriodFactory as t, VegaRTEToolbarButtonRenderer as u, RTETokenNode as v, waitForVega as w, RTETokenNodeRenderer as x, RTELanguageToolbarButtonRenderer as y };
+export { VegaRTEToolbarButtonRenderer as A, RTETokenNode as B, RTETokenNodeRenderer as C, RTELanguageToolbarButtonRenderer as D, RTEBlockquoteBlock as E, DeleteSelectedContentAction as F, ActionHandlerInterceptor as G, InsertNodeToNearestRootAction as I, RTETokenToolbarButtonRenderer as R, VegaLoader as V, VegaNotify as a, VegaEventManager$1 as b, VegaZIndexManager$1 as c, VegaSkeletonLoader as d, VegaTranslation as e, VegaRTETokenExtension as f, VegaRTELanguageExtension as g, VegaRTEDefaultLineHeightOptions as h, VegaRTEFunctionExtension as i, VegaRTETableExtension as j, VegaRTEHorizontalLineExtension as k, VegaRTEBlockquoteExtension as l, VegaRTESpecialCharactersExtension as m, VegaRTEFindReplaceExtension as n, VegaRTESpecialCharactersEssentials as o, VegaRTESpecialCharactersLatin as p, VegaRTESpecialCharactersMathematical as q, VegaRTESpecialCharactersArrows as r, VegaRTESpecialCharactersCurrency as s, VegaRTESpecialCharactersText as t, VegaRTELineHeightExtension as u, VegaRTEPasteExtension as v, waitForVega as w, VegaRTECopyExtension as x, VegaRTECutExtension as y, VegaCalendarPeriodFactory as z };