@globalpayments/vega 2.87.0-beta.1 → 2.88.0

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/constants/default-categories.js

@@ -0,0 +1,37 @@
+import { ARROW_CHARACTERS } from './arrow-characters';
+import { CURRENCY_CHARACTERS } from './currency-characters';
+import { LATIN_CHARACTERS } from './latin-characters';
+import { MATHEMATICAL_CHARACTERS } from './mathematical-characters';
+import { TEXT_CHARACTERS } from './text-characters';
+export const VegaRTESpecialCharactersLatin = {
+  key: 'latin',
+  label: 'Latin',
+  characters: LATIN_CHARACTERS,
+};
+export const VegaRTESpecialCharactersMathematical = {
+  key: 'mathematical',
+  label: 'Mathematical',
+  characters: MATHEMATICAL_CHARACTERS,
+};
+export const VegaRTESpecialCharactersArrows = {
+  key: 'arrows',
+  label: 'Arrows',
+  characters: ARROW_CHARACTERS,
+};
+export const VegaRTESpecialCharactersCurrency = {
+  key: 'currency',
+  label: 'Currency',
+  characters: CURRENCY_CHARACTERS,
+};
+export const VegaRTESpecialCharactersText = {
+  key: 'text',
+  label: 'Text',
+  characters: TEXT_CHARACTERS,
+};
+export const VegaRTESpecialCharactersEssentials = [
+  VegaRTESpecialCharactersCurrency,
+  VegaRTESpecialCharactersText,
+  VegaRTESpecialCharactersMathematical,
+  VegaRTESpecialCharactersArrows,
+  VegaRTESpecialCharactersLatin,
+];

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/constants/latin-characters.js

@@ -0,0 +1,130 @@
+export 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' },
+];

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/constants/mathematical-characters.js

@@ -0,0 +1,46 @@
+export 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' },
+];

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/constants/text-characters.js

@@ -0,0 +1,29 @@
+export 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' },
+];

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/special-characters-extension.js

@@ -0,0 +1,34 @@
+import { VegaRTEExtension } from '../extension.abstract';
+import { VegaRTESpecialCharactersEssentials } from './constants/default-categories';
+import { RTESpecialCharactersToolbarButtonRenderer } from './special-characters-toolbar-button-renderer';
+/**
+ * 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.
+ */
+export class VegaRTESpecialCharactersExtension extends VegaRTEExtension {
+  constructor(config) {
+    super();
+    this.categories = this.buildCategories(config);
+  }
+  /** @inheritDoc */
+  prepareBeforeLoad(host) {
+    this.registerToolbarButtonRenderer('special-characters', 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];
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/special-characters-icon.js

@@ -0,0 +1,3 @@
+export default {
+  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>`,
+};

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/special-characters-toolbar-button-renderer.js

@@ -0,0 +1,184 @@
+import { VegaRTEToolbarButtonRenderer } from '../base-toolbar-button-renderer';
+import { VegaInternalIconManager } from '../../../../helpers/icon/internal-icon-manager';
+import specialCharactersIcon from './special-characters-icon';
+import { DomNodeSubjectObserverFactory } from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
+import { VegaClick, VegaPopoverShow } from '../../../../helpers/event-manager/event-id/vega-event-id';
+import { ReplaceSelectedTextAction } from '../../dto/actions/replace-selected-text-action';
+import { UpdateCursorPositionAction } from '../../dto/actions/update-cursor-position-action';
+import { UpdateTextAction } from '../../dto/actions/update-text-action';
+import { InsertChildrenBeforeAction } from '../../dto/actions/insert-children-before-block';
+import { RTETextNode } from '../../dto/nodes/text-node';
+/**
+ * Toolbar button renderer for the Special Characters extension.
+ * Renders a toolbar button with an Ω icon that opens a popover panel
+ * with categorized character grids.
+ */
+export 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 });
+})();

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/types.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/vega-rich-text-special-characters-panel/constants.js

@@ -0,0 +1,11 @@
+/**
+ * Synthetic key used by the panel's category dropdown to represent the
+ * "All" entry that aggregates characters from every configured category.
+ */
+export const ALL_CATEGORY_KEY = '__all__';
+/**
+ * Number of columns in the character grid.
+ * Used by keyboard navigation and exposed as a CSS custom property
+ * (`--vega-special-characters-grid-columns`) so the grid layout stays in sync without duplication.
+ */
+export const GRID_COLUMNS = 10;

package/dist/collection/components/vega-rich-text-editor/extensions/special-characters/vega-rich-text-special-characters-panel/slimmers/controllers/special-characters-panel-keyboard-controller.js

@@ -0,0 +1,85 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField } from 'vega-slimmer/core';
+import { KeyboardManagerSlimmer } from '../../../../../../../helpers/slimmers/keyboard-manager-slimmer';
+import { GRID_COLUMNS } from '../../constants';
+/**
+ * Handles arrow-key navigation within the Special Characters panel grid.
+ * Escape, Tab, Enter, and Space are not handled here — the popover and
+ * native button elements manage those interactions.
+ */
+export class SpecialCharactersPanelKeyboardController extends KeyboardManagerSlimmer {
+  constructor() {
+    super(() => {
+      return [
+        {
+          keyCode: ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'],
+          eventName: 'keydown',
+          // Listeners register in componentDidLoad, so the grid ref is always set by then.
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          activeElementInScope: () => [this.renderer.getGridRef()],
+          preventDefault: true,
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          callback: (event) => {
+            this.handleNavigation(event);
+          },
+        },
+      ];
+    });
+  }
+  /**
+   * Translates an arrow key press into a new active cell index
+   * and asks the renderer to move focus.
+   *
+   * @param {KeyboardEvent} event - The grid-scoped keydown event.
+   */
+  handleNavigation(event) {
+    const renderer = this.renderer;
+    const total = renderer.getCellCount();
+    if (total === 0) {
+      return;
+    }
+    const current = Math.min(Math.max(renderer.getActiveCellIndex(), 0), total - 1);
+    const row = Math.floor(current / GRID_COLUMNS);
+    const col = current % GRID_COLUMNS;
+    const lastRow = Math.floor((total - 1) / GRID_COLUMNS);
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    const lastColInRow = (r) => {
+      return r === lastRow ? (total - 1) % GRID_COLUMNS : GRID_COLUMNS - 1;
+    };
+    let target = current;
+    switch (event.code) {
+      case 'ArrowLeft':
+        if (col > 0) {
+          target = current - 1;
+        }
+        break;
+      case 'ArrowRight':
+        if (col < lastColInRow(row)) {
+          target = current + 1;
+        }
+        break;
+      case 'ArrowUp':
+        if (row > 0) {
+          target = current - GRID_COLUMNS;
+        }
+        break;
+      case 'ArrowDown':
+        if (row < lastRow) {
+          const next = current + GRID_COLUMNS;
+          target = next < total ? next : lastRow * GRID_COLUMNS + lastColInRow(lastRow);
+        }
+        break;
+    }
+    if (target !== current) {
+      renderer.focusCellByIndex(target);
+    }
+  }
+}
+__decorate([
+  MapToComponentField()
+], SpecialCharactersPanelKeyboardController.prototype, "renderer", void 0);