npm - @globalpayments/vega - Versions diffs - 2.98.0 → 2.100.0 - Mend

@globalpayments/vega 2.98.0 → 2.100.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (645) hide show

package/dist/collection/components/vega-rich-text-editor/extensions/find-replace/slimmer/renderers/find-replace-toolbar-button-renderer.js CHANGED Viewed

@@ -8,6 +8,7 @@ import { FindController } from '../controllers/find-controller';
 import { ReplaceController } from '../controllers/replace-controller';
 import { VegaInternalTranslation } from '../../../../../../helpers/translation/internal-translation-controller';
 import { debounce } from '../../../../../../utils/timer';
+import { getDeepActiveElementInShadow } from '../../../../../../utils/ui';
 /**
  * Toolbar button renderer for the Find & Replace extension.
  *
@@ -60,14 +61,22 @@ export class FindReplaceToolbarButtonRenderer extends VegaRTEToolbarButtonRender
       placement: 'bottom',
       showArrow: false,
       isScreenPosition: true,
+      role: 'presentation',
       // eslint-disable-next-line jsdoc/require-jsdoc
       ref: (ref) => {
         if (ref) {
           this.popoverRef = ref;
           DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverHide, () => {
+            const shouldRestoreFocus = this.shouldRestoreFocusToButton();
             this.isPopoverOpen = false;
             this.findController.clear();
             this.updatePanel({ current: 0, total: 0 });
+            if (shouldRestoreFocus) {
+              // Defer so it runs after the popover's own focus-restore
+              // (AriaDialogFocusableTrapSlimmer), returning focus to the toolbar
+              // button for keyboard and VoiceOver users when the panel is dismissed.
+              setTimeout(() => this.focusToolbarButton());
+            }
           });
           DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, () => {
             this.isPopoverOpen = true;
@@ -98,6 +107,7 @@ export class FindReplaceToolbarButtonRenderer extends VegaRTEToolbarButtonRender
       ]),
       h('div', { slot: 'popover-content' }, this.renderButton(h, editorContext, {
         icon: 'rte-find-replace',
+        ariaLabel: editorContext.translation.t('Find and replace'),
         tooltip: { text: VegaInternalTranslation.t('Find and replace') },
       })),
     ]);
@@ -200,6 +210,47 @@ export class FindReplaceToolbarButtonRenderer extends VegaRTEToolbarButtonRender
       void this.popoverRef.hide();
     }
   }
+  /**
+   * Decides whether closing the panel should return focus to the toolbar button.
+   *
+   * Focus is restored when the panel is dismissed while focus is still inside it
+   * (Escape key or the Close button) — including the VoiceOver case where the
+   * dialog's `inert` blur has already moved focus to `<body>`. It is not restored
+   * when focus has intentionally moved to another element (Tab out of the panel
+   * or interacting with something else), so we don't yank focus back.
+   *
+   * @returns {boolean} True when focus should return to the toolbar button.
+   */
+  shouldRestoreFocusToButton() {
+    // eslint-disable-next-line no-restricted-globals
+    const activeEl = getDeepActiveElementInShadow(document, true);
+    // eslint-disable-next-line no-restricted-globals
+    return !activeEl || activeEl === document.body || this.isElementWithinPanel(activeEl);
+  }
+  /**
+   * Checks whether an element is inside the panel, crossing shadow boundaries.
+   *
+   * @param {Nullable<HTMLElement>} el - The element to test.
+   * @returns {boolean} True when the element is contained by the panel.
+   */
+  isElementWithinPanel(el) {
+    if (!el || !this.panelRef) {
+      return false;
+    }
+    let node = el;
+    while (node) {
+      if (node === this.panelRef) {
+        return true;
+      }
+      const parent = node.parentNode;
+      // Cross shadow boundaries: a shadow root (nodeType 11) exposes its `host`.
+      node =
+        parent && parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE
+          ? parent.host
+          : parent;
+    }
+    return false;
+  }
 }
 (() => {
   VegaInternalIconManager.register({ 'rte-find-replace': findReplaceIcon });

package/dist/collection/components/vega-rich-text-editor/extensions/find-replace/vega-rich-text-find-replace-panel/slimmers/renderers/find-replace-panel-renderer.js CHANGED Viewed

@@ -26,7 +26,7 @@ export class FindReplacePanelRenderer extends VegaSlimmer {
       h("div", { class: "find-replace-panel__field" },
         h("vega-field-label", { label: VegaInternalTranslation.t('Find in text') }),
         h("div", { class: "find-replace-panel__body" },
-          h("vega-input", { size: "small", label: "", class: "find-replace-panel__input", ref: (ref) => {
+          h("vega-input", { size: "small", label: "", "data-aria-label": VegaInternalTranslation.t('Find in text'), class: "find-replace-panel__input", ref: (ref) => {
               if (ref) {
                 DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, (e) => {
                   this.onKeywordChange(e.detail);
@@ -40,7 +40,7 @@ export class FindReplacePanelRenderer extends VegaSlimmer {
       h("div", { class: "find-replace-panel__field" },
         h("vega-field-label", { label: VegaInternalTranslation.t('Replace with') }),
         h("div", { class: "find-replace-panel__body" },
-          h("vega-input", { disabled: !hasResults, size: "small", label: "", class: "find-replace-panel__input", ref: (ref) => {
+          h("vega-input", { disabled: !hasResults, size: "small", label: "", "data-aria-label": VegaInternalTranslation.t('Replace with'), class: "find-replace-panel__input", ref: (ref) => {
               if (ref) {
                 DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, (e) => {
                   this.onReplacementChange(e.detail);

package/dist/collection/components/vega-rich-text-editor/extensions/fullscreen/fullscreen-toolbar-button-renderer.js CHANGED Viewed

@@ -30,6 +30,9 @@ export class RTEFullscreenToolbarButtonRenderer extends VegaRTEToolbarButtonRend
     const selected = this.isSelected();
     return this.renderButton(createElement, editorContext, {
       icon: selected ? 'rte-fullscreen-exit' : 'rte-fullscreen-enter',
+      ariaLabel: selected
+        ? editorContext.translation.t('Exit fullscreen mode')
+        : editorContext.translation.t('Enter fullscreen mode'),
       tooltip: {
         text: selected
           ? VegaInternalTranslation.t('Exit fullscreen mode')

package/dist/collection/components/vega-rich-text-editor/extensions/functions/action-handler-strategies/insert-function-block-strategy.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { generateUUID } from '../../../../../utils/misc';
 import { InsertChildrenAfterAction } from '../../../dto/actions/insert-children-after-block';
 import { AppendChildrenAction } from '../../../dto/actions/append-child-nodes-action';
 import { RTEFunctionBlock } from '../dto/function-block';
+import { FUNCTION_CONTENT_CLASS } from '../constants';
 /**
  * Strategy to handle the insertion of a function block into the rich text editor.
  */
@@ -46,7 +47,7 @@ export class InsertFunctionBlockStrategy extends ActionHandleStrategy {
         {
           id: `${id}-2`,
           annotations: {
-            customClass: ['statementelement'],
+            customClass: [FUNCTION_CONTENT_CLASS],
           },
           type: 'paragraph',
           nodes: [
@@ -65,7 +66,7 @@ export class InsertFunctionBlockStrategy extends ActionHandleStrategy {
         {
           id: `${id}-4`,
           annotations: {
-            customClass: ['statementelement'],
+            customClass: [FUNCTION_CONTENT_CLASS],
           },
           type: 'paragraph',
           nodes: [

package/dist/collection/components/vega-rich-text-editor/extensions/functions/constants.js ADDED Viewed

@@ -0,0 +1,8 @@
+export const FUNCTION_BLOCK_CLASS = 'statement';
+export const FUNCTION_CONTENT_CLASS = 'statementelement';
+export const FUNCTION_SYNTAX_CLASS = 'statementsyntax';
+export const FUNCTION_ELEMENT_CLASSES = [
+  FUNCTION_BLOCK_CLASS,
+  FUNCTION_CONTENT_CLASS,
+  FUNCTION_SYNTAX_CLASS,
+];

package/dist/collection/components/vega-rich-text-editor/extensions/functions/dto/function-block.js CHANGED Viewed

@@ -2,6 +2,8 @@ import { generateUUID } from '../../../../../utils/misc';
 import { RTEAnnotationStyle } from '../../../dto/annotations/annotation-style';
 import { RTEBlock } from '../../../dto/blocks/block.abstract';
 import { RTETextBlock } from '../../../dto/blocks/text-block';
+import { FUNCTION_BLOCK_CLASS, FUNCTION_CONTENT_CLASS } from '../constants';
+import { RTE_BLOCK_BOUNDARY_ATTRIBUTE } from '../../../constants/constant';
 /**
  * RTE Function Block
  */
@@ -21,7 +23,7 @@ export class RTEFunctionBlock extends RTEBlock {
    */
   static from(block, options) {
     const functionBlock = new RTEFunctionBlock(block.id);
-    const defaultAnnotation = { customClass: ['statement'] };
+    const defaultAnnotation = { customClass: [FUNCTION_BLOCK_CLASS] };
     let { annotations } = block;
     annotations = annotations
       ? Object.assign(Object.assign({}, annotations), defaultAnnotation) : defaultAnnotation;
@@ -39,14 +41,14 @@ export class RTEFunctionBlock extends RTEBlock {
       .map((child) => {
       if (child instanceof RTETextBlock) {
         const attrStr = this.getFunctionContentStyle(child);
-        return `<div class="statementelement"${attrStr}>${child.getChildrenHtml()}</div>`;
+        return `<div class="${FUNCTION_CONTENT_CLASS}"${attrStr}>${child.getChildrenHtml()}</div>`;
       }
       else {
         return child.toHtml();
       }
     })
       .join('');
-    return `<div class="statement">${childrenHtml}</div>`;
+    return `<div class="${FUNCTION_BLOCK_CLASS}" ${RTE_BLOCK_BOUNDARY_ATTRIBUTE}>${childrenHtml}</div>`;
   }
   /**
    * @inheritDoc
@@ -67,6 +69,15 @@ export class RTEFunctionBlock extends RTEBlock {
   getLastNode() {
     return this.children[this.children.length - 1].getLastNode();
   }
+  /**
+   * The function block is an atomic caret boundary: descending would resolve the caret onto a
+   * `contenteditable="false"` logic-control node instead of staying anchored to the block.
+   *
+   * @inheritDoc
+   */
+  allowsCaretDescend() {
+    return false;
+  }
   /**
    * @inheritDoc
    */

package/dist/collection/components/vega-rich-text-editor/extensions/functions/dto/logic-control-block.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { RTEBlock } from '../../../dto/blocks/block.abstract';
+import { FUNCTION_SYNTAX_CLASS } from '../constants';
 import { RTELogicControlNode } from '../dto/logic-control-node';
 /**
  * Class representing a logic control block in the rich text editor.
@@ -48,7 +49,7 @@ export class RTELogicControlBlock extends RTEBlock {
    * @returns {string} - The HTML string of the logic control block.
    */
   toHtml() {
-    return `<div class='statementsyntax' contenteditable='false'>${this.statementText}</div>`;
+    return `<div class='${FUNCTION_SYNTAX_CLASS}' contenteditable='false'>${this.statementText}</div>`;
   }
   /**
    * Clone the current block instance.

package/dist/collection/components/vega-rich-text-editor/extensions/functions/dto/logic-control-node.js CHANGED Viewed

@@ -67,5 +67,11 @@ export class RTELogicControlNode extends RTENode {
   isContentEditable() {
     return false;
   }
+  /**
+   * @inheritDoc
+   */
+  getPlainText() {
+    return this.text;
+  }
 }
 RTELogicControlNode.dtoName = 'RTELogicControlNode';

package/dist/collection/components/vega-rich-text-editor/extensions/functions/element-to-dto-strategies/div-containing-function-block-strategy.js ADDED Viewed

@@ -0,0 +1,19 @@
+import { HtmlBlockStrategy } from '../../../slimmers/controllers/helper/element-to-dto-strategy/html-block-strategy';
+import { FUNCTION_BLOCK_CLASS } from '../constants';
+import { RTE_BLOCK_BOUNDARY_ATTRIBUTE } from '../../../constants/constant';
+import { isFunctionBlockElement } from '../utils';
+/** Preserve a div that contains a function block during auto-formatting. */
+export class FunctionBlockContainerStrategy extends HtmlBlockStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(elementsArray, currentIndex) {
+    const element = elementsArray[currentIndex];
+    if (element.nodeType !== Node.ELEMENT_NODE)
+      return 0;
+    const containsFunctionBlock = !!element.querySelector(`[${RTE_BLOCK_BOUNDARY_ATTRIBUTE}], .${FUNCTION_BLOCK_CLASS}`);
+    return element.nodeName === 'DIV' && !isFunctionBlockElement(element) && containsFunctionBlock
+      ? 1
+      : 0;
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/functions/element-to-dto-strategies/div-to-function-block-strategy.js CHANGED Viewed

@@ -1,6 +1,8 @@
 import { generateUUID } from '../../../../../utils/misc';
 import { ElementToDTOStrategy } from '../../../slimmers/controllers/helper/element-to-dto-strategy/element-to-dto-strategy.abstract';
 import { RTEFunctionBlock } from '../dto/function-block';
+import { FUNCTION_BLOCK_CLASS, FUNCTION_SYNTAX_CLASS } from '../constants';
+import { isFunctionBoundaryContainer } from '../utils';
 /**
  * Strategy to convert a div with class 'statement' into an function block.
  */
@@ -10,11 +12,13 @@ export class DivToFunctionBlockStrategy extends ElementToDTOStrategy {
    */
   canHandle(elementsArray, currentIndex) {
     const element = elementsArray[currentIndex];
-    return element &&
-      element.tagName === 'DIV' &&
-      element.classList.contains('statement') &&
+    if (element.nodeType !== Node.ELEMENT_NODE)
+      return 0;
+    const isFunctionBoundary = isFunctionBoundaryContainer(element);
+    return element.tagName === 'DIV' &&
+      isFunctionBoundary &&
       element.childNodes.length &&
-      element.querySelector('.statementsyntax')
+      element.querySelector(`.${FUNCTION_SYNTAX_CLASS}`)
       ? 1
       : 0;
   }
@@ -26,7 +30,7 @@ export class DivToFunctionBlockStrategy extends ElementToDTOStrategy {
       id: generateUUID(),
       type: 'function-block',
       annotations: {
-        customClass: ['statement'],
+        customClass: [FUNCTION_BLOCK_CLASS],
       },
       children: [],
     });

package/dist/collection/components/vega-rich-text-editor/extensions/functions/element-to-dto-strategies/div-to-function-content-strategy.js CHANGED Viewed

@@ -2,13 +2,14 @@ import { generateUUID } from '../../../../../utils/misc';
 import { RTETextBlock } from '../../../dto/blocks/text-block';
 import htmlElementToAnnotationGenerator from '../../../slimmers/controllers/helper/element-to-dto-strategy/annotation-handler/html-element-to-annotation-generator';
 import { DivToLogicControlBlockStrategy } from './div-to-logic-control-block-strategy';
+import { FUNCTION_CONTENT_CLASS } from '../constants';
 /**
  * Strategy to convert a div with class 'statementelement' into an function block.
  */
 export class DivToFunctionContentStrategy extends DivToLogicControlBlockStrategy {
   constructor() {
     super(...arguments);
-    this.blockClassName = 'statementelement';
+    this.blockClassName = FUNCTION_CONTENT_CLASS;
   }
   /**
    * @inheritDoc
@@ -16,12 +17,11 @@ export class DivToFunctionContentStrategy extends DivToLogicControlBlockStrategy
   handle(elementsArray, options) {
     const element = elementsArray[0];
     const annotations = htmlElementToAnnotationGenerator.generate(RTETextBlock, element);
-    const nodes = Array.from(elementsArray[0].childNodes);
     return RTETextBlock.from({
       id: generateUUID(),
       type: 'paragraph',
       annotations: Object.assign({ customClass: [this.blockClassName] }, annotations),
-      nodes: this.generateChildNodes(nodes, undefined, options),
+      nodes: this.generateChildNodes(Array.from(elementsArray[0].childNodes), undefined, options),
     });
   }
 }

package/dist/collection/components/vega-rich-text-editor/extensions/functions/element-to-dto-strategies/div-to-logic-control-block-strategy.js CHANGED Viewed

@@ -1,13 +1,15 @@
 import { generateUUID } from '../../../../../utils/misc';
 import { RTELogicControlBlock } from '../dto/logic-control-block';
 import { BlockToRTEBlockStrategyAbstract } from '../../../slimmers/controllers/helper/element-to-dto-strategy/block-to-rte-block-strategy.abstract';
+import { FUNCTION_SYNTAX_CLASS } from '../constants';
+import { isFunctionBoundaryContainer } from '../utils';
 /**
  * Strategy to convert a div with class 'statementsyntax' into an RTELogicControlBlock DTO.
  */
 export class DivToLogicControlBlockStrategy extends BlockToRTEBlockStrategyAbstract {
   constructor() {
     super(...arguments);
-    this.blockClassName = 'statementsyntax';
+    this.blockClassName = FUNCTION_SYNTAX_CLASS;
   }
   /**
    * @inheritDoc
@@ -50,6 +52,6 @@ export class DivToLogicControlBlockStrategy extends BlockToRTEBlockStrategyAbstr
    * @returns {boolean} True if the element is a child of a function block, false otherwise
    */
   isFunctionBlockChild(element) {
-    return !!(element.parentElement && element.parentElement.classList.contains('statement'));
+    return !!(element.parentElement && isFunctionBoundaryContainer(element.parentElement));
   }
 }

package/dist/collection/components/vega-rich-text-editor/extensions/functions/function-extension.js CHANGED Viewed

@@ -10,6 +10,7 @@ import { RTELogicControlBlockRenderer } from './renderers/logic-control-block-re
 import { DivToLogicControlBlockStrategy } from './element-to-dto-strategies/div-to-logic-control-block-strategy';
 import { DivToFunctionBlockStrategy } from './element-to-dto-strategies/div-to-function-block-strategy';
 import { DivToFunctionContentStrategy } from './element-to-dto-strategies/div-to-function-content-strategy';
+import { FunctionBlockContainerStrategy } from './element-to-dto-strategies/div-containing-function-block-strategy';
 import { RTEFunctionBlock } from './dto/function-block';
 import { RTEFunctionBlockRenderer } from './renderers/function-block-renderer';
 import { ModifyContentActionType } from '../../dto/actions/modify-content-action.abstract';
@@ -18,15 +19,18 @@ import { FunctionBlockInsertParagraphStrategy } from './action-handler-strategie
 import { PreventPasteContentInterceptor } from './action-handler-interceptor/prevent-paste-content-interceptor';
 import { PASTE_PLAIN_TEXT } from './actions/paste-plain-text-action';
 import { PastePlainTextStrategy } from './action-handler-strategies/paste-plain-text-strategy';
+import { isFunctionBlockElement } from './utils';
 const convertLogicControlBlockStrategy = new DivToLogicControlBlockStrategy();
 const convertFunctionContentStrategy = new DivToFunctionContentStrategy();
 const convertFunctionBlockStrategy = new DivToFunctionBlockStrategy();
+const convertFunctionBlockContainerStrategy = new FunctionBlockContainerStrategy();
 /**
  * Function extension class for Vega Rich Text Editor.
  */
 export class VegaRTEFunctionExtension extends VegaRTEExtension {
   constructor() {
     super();
+    this.unregisterBlockBoundaryPredicate = null;
     this.registerBlockBasicStrategies(RTELogicControlBlock.name);
     this.registerBlockBasicStrategies(RTEFunctionBlock.name);
     this.preventFunctionBlockDefaultInsertNewParagraph();
@@ -37,11 +41,25 @@ export class VegaRTEFunctionExtension extends VegaRTEExtension {
     this.registerElementToBlockDTOClassStrategy(convertLogicControlBlockStrategy);
     this.registerElementToBlockDTOClassStrategy(convertFunctionContentStrategy);
     this.registerElementToBlockDTOClassStrategy(convertFunctionBlockStrategy);
+    this.registerElementToBlockDTOClassStrategy(convertFunctionBlockContainerStrategy);
   }
   /** @inheritDoc */
   prepareBeforeLoad(host) {
     this.registerToolbarButtonRenderer(VegaRTEFunctionExtension.TOOLBAR_BUTTON_KEY, new FunctionToolbarButtonRenderer(), host);
   }
+  /** @inheritDoc */
+  initialExtensionAfterLoad(context) {
+    var _a;
+    super.initialExtensionAfterLoad(context);
+    (_a = this.unregisterBlockBoundaryPredicate) === null || _a === void 0 ? void 0 : _a.call(this);
+    this.unregisterBlockBoundaryPredicate = this.registerBlockBoundaryPredicate(isFunctionBlockElement);
+  }
+  /** @inheritDoc */
+  destroyExtension() {
+    var _a;
+    (_a = this.unregisterBlockBoundaryPredicate) === null || _a === void 0 ? void 0 : _a.call(this);
+    this.unregisterBlockBoundaryPredicate = null;
+  }
   /**
    * Remove the appen children strategies to prevent default insert new paragraph logic in function block
    */

package/dist/collection/components/vega-rich-text-editor/extensions/functions/renderers/function-block-renderer.js CHANGED Viewed

@@ -1,4 +1,6 @@
 import { VegaRTEExtensionRenderer } from '../../base-extension-renderer';
+import { FUNCTION_BLOCK_CLASS } from '../constants';
+import { RTE_BLOCK_BOUNDARY_ATTRIBUTE } from '../../../constants/constant';
 import styles from './function-block-styles.css';
 /**
  * Renderer for Function Block
@@ -11,6 +13,7 @@ export class RTEFunctionBlockRenderer extends VegaRTEExtensionRenderer {
     return createElement('div', {
       key: renderData.id,
       class: this.getElementClassName(renderData),
+      [RTE_BLOCK_BOUNDARY_ATTRIBUTE]: '',
       ref: this.useRef(renderData),
     });
   }
@@ -30,8 +33,8 @@ export class RTEFunctionBlockRenderer extends VegaRTEExtensionRenderer {
    */
   getElementClassName(block) {
     let classes = block.getClasses();
-    if (classes.indexOf('statement') < 0) {
-      classes = 'statement ' + classes;
+    if (classes.indexOf(FUNCTION_BLOCK_CLASS) < 0) {
+      classes = FUNCTION_BLOCK_CLASS + ' ' + classes;
     }
     return classes.trim();
   }

package/dist/collection/components/vega-rich-text-editor/extensions/functions/renderers/function-toolbar-button-renderer.js CHANGED Viewed

@@ -13,6 +13,7 @@ export class FunctionToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer
     return this.renderDropdown(h, editorContext, {}, [
       this.renderButton(h, editorContext, {
         label: 'Functions',
+        ariaLabel: 'Functions',
         showArrowIcon: true,
         tooltip: { text: 'Insert function' },
       }),

package/dist/collection/components/vega-rich-text-editor/extensions/functions/renderers/logic-control-block-renderer.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { VegaRTEExtensionRenderer } from '../../base-extension-renderer';
+import { FUNCTION_SYNTAX_CLASS } from '../constants';
 /**
  * Renders a logic control block in the rich text editor.
  */
@@ -9,7 +10,7 @@ export class RTELogicControlBlockRenderer extends VegaRTEExtensionRenderer {
   doRender(h, renderData) {
     return h('div', {
       key: renderData.id,
-      class: 'statementsyntax',
+      class: FUNCTION_SYNTAX_CLASS,
       ref: this.useRef(renderData),
     }, h('span', {
       key: `${renderData.id}-1`,

package/dist/collection/components/vega-rich-text-editor/extensions/functions/utils.js ADDED Viewed

@@ -0,0 +1,36 @@
+import { RTE_BLOCK_BOUNDARY_ATTRIBUTE } from '../../constants/constant';
+import { FUNCTION_BLOCK_CLASS, FUNCTION_ELEMENT_CLASSES } from './constants';
+/**
+ * Returns true when the element belongs to function extension blocks by semantic
+ * boundary attribute or known function element classes.
+ *
+ * Use this helper for broad detection (e.g., extension-level boundary predicate
+ * registration) where both container and child function elements should be
+ * treated as part of the function block structure.
+ *
+ * @param {HTMLElement} element - Element to inspect.
+ * @returns {boolean} Whether the element belongs to a function block structure.
+ * @example
+ * this.registerBlockBoundaryPredicate(isFunctionBlockElement);
+ */
+export const isFunctionBlockElement = (element) => {
+  return (element.hasAttribute(RTE_BLOCK_BOUNDARY_ATTRIBUTE) ||
+    FUNCTION_ELEMENT_CLASSES.some((functionClass) => element.classList.contains(functionClass)));
+};
+/**
+ * Returns true when the element is a function block boundary container.
+ *
+ * Use this helper when conversion logic must identify only the function block
+ * container element (the DIV that maps to RTEFunctionBlock), not function child
+ * elements such as syntax/content nodes.
+ *
+ * @param {HTMLElement} element - Element to inspect.
+ * @returns {boolean} Whether the element is a function block boundary container.
+ * @example
+ * if (isFunctionBoundaryContainer(element)) {
+ *     // map the DIV to RTEFunctionBlock
+ * }
+ */
+export const isFunctionBoundaryContainer = (element) => {
+  return (element.hasAttribute(RTE_BLOCK_BOUNDARY_ATTRIBUTE) || element.classList.contains(FUNCTION_BLOCK_CLASS));
+};

package/dist/collection/components/vega-rich-text-editor/extensions/horizontal-line/renderers/horizontal-line-toolbar-button-renderer.js CHANGED Viewed

@@ -19,6 +19,7 @@ export class RTEHorizontalLineToolbarButtonRenderer extends VegaRTEToolbarButton
   render(createElement, editorContext) {
     return this.renderButton(createElement, editorContext, {
       icon: 'horizontal-line',
+      ariaLabel: VegaInternalTranslation.t('Horizontal line'),
       tooltip: { text: VegaInternalTranslation.t('Horizontal line') },
     });
   }

package/dist/collection/components/vega-rich-text-editor/extensions/languages/language-extension.js CHANGED Viewed

@@ -130,6 +130,7 @@ export class VegaRTELanguageExtension extends VegaRTEExtension {
           options = {
             autoMatchFormat: (_a = host.sourceEditConfig.autoMatchFormat) !== null && _a !== void 0 ? _a : true,
             filterInlineStyles: host.sourceEditConfig.filterInlineStyles,
+            blockBoundaryRegistry: this.extensionContext.blockBoundaryRegistry,
           };
         }
         result = VegaRTEContent.fromHtml(codeBlock.value.code, options);

package/dist/collection/components/vega-rich-text-editor/extensions/languages/language-toolbar-button-renderer.js CHANGED Viewed

@@ -59,6 +59,7 @@ export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRender
     return this.renderDropdown(createElement, editorContext, { source: translatedSource }, [
       this.renderButton(createElement, editorContext, {
         label: this.getLanguageLabelByKey(this.selectedLanguage),
+        ariaLabel: 'Language',
         showArrowIcon: true,
         tooltip: { text: 'Select language' },
       }),
@@ -74,10 +75,11 @@ export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRender
     this.translation = editorContext.translation;
     const isDisabled = this.isDisabled(editorContext);
     return h('vega-font', {
-      variant: 'font-field-label-sm',
-      color: isDisabled ? 'text-disabled' : 'text-primary',
+      'variant': 'font-field-label-sm',
+      'color': isDisabled ? 'text-disabled' : 'text-primary',
+      'aria-hidden': 'true',
       // eslint-disable-next-line jsdoc/require-jsdoc
-      ref: (el) => {
+      'ref': (el) => {
         this.labelRef = el;
       },
     }, editorContext.translation.t(label));

package/dist/collection/components/vega-rich-text-editor/extensions/line-height/line-height-toolbar-button-renderer.js CHANGED Viewed

@@ -34,12 +34,28 @@ export class RTELineHeightToolbarButtonRenderer extends VegaRTEToolbarButtonRend
     }, [
       this.renderButton(createElement, editorContext, {
         icon: 'line-height',
+        ariaLabel: editorContext.translation.t('Line Height'),
         showArrowIcon: true,
         tooltip: { text: VegaInternalTranslation.t('Line Height') },
       }),
       this.renderDropdownListTemplate(createElement, dropdownItems, editorContext),
     ]);
   }
+  /**
+   * Renders each line-height option with its label as light-DOM children rather than the
+   * `label` prop. This gives the focusable menuitem a light-DOM text anchor so Safari
+   * VoiceOver's reading cursor follows focus into the item (Ctrl+Opt+Right walks item→item
+   * instead of escaping to the next toolbar button).
+   *
+   * The label is wrapped in a `<span>` (not a bare text node) so a click targeting the label
+   * lands on a slotted element that composes into the item's shadow `<li>`; a bare text node
+   * resolves to the `vega-dropdown-item` host, whose click never reaches the shadow handler.
+   *
+   * @inheritDoc
+   */
+  renderDropdownItem(h, item, editorContext) {
+    return h('vega-dropdown-item', { key: item.key, itemKey: item.key, prefixIcon: item.icon }, h('span', undefined, editorContext.translation.t(item.label)));
+  }
   /**
    * @inheritDoc
    */

package/dist/collection/components/vega-rich-text-editor/extensions/paste/action-handler-strategies/image-replace-src-strategy.js ADDED Viewed

@@ -0,0 +1,21 @@
+import { ActionHandleStrategy } from '../../../dto/action-handle-strategies/action-handle-strategy.abstract';
+import { PasteImageParser } from '../parse-local-images-helper/paste-image-parser';
+/**
+ * Strategy to handle the `ImageReplaceSrcAction` for replacing the `src` attribute of an `<img>` element in the RTE content.
+ */
+export class ImageReplaceSrcStrategy extends ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(action, target) {
+    const { img, url } = action;
+    img.setAttribute('src', url);
+    img.removeAttribute(PasteImageParser.PREVIEW_IMG_KEY);
+    target.url = url;
+    if (target.annotationMap && target.annotationMap.has('CUSTOM_ATTRIBUTE')) {
+      const customAttributeAnnotation = target.annotationMap.get('CUSTOM_ATTRIBUTE');
+      customAttributeAnnotation.customAttribute.src = url;
+      delete customAttributeAnnotation.customAttribute[PasteImageParser.PREVIEW_IMG_KEY];
+    }
+  }
+}

package/dist/collection/components/vega-rich-text-editor/extensions/paste/actions/image-replace-src-action.js ADDED Viewed

@@ -0,0 +1,13 @@
+import { ModifyContentAction } from '../../../dto/actions/modify-content-action.abstract';
+export const REPLACE_IMAGE_SRC = 'REPLACE_IMAGE_SRC';
+/**
+ * Action to replace the `src` attribute of an `<img>` element in the RTE content.
+ */
+export class ImageReplaceSrcAction extends ModifyContentAction {
+  constructor(imageElement, url) {
+    super();
+    this.type = REPLACE_IMAGE_SRC;
+    this.img = imageElement;
+    this.url = url;
+  }
+}