@globalpayments/vega 2.34.1 → 2.36.0

package/dist/cjs/{create-public-api-runtime-metrics-slimmer-8c6a8fb7.js → create-public-api-runtime-metrics-slimmer-54c3f73b.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
-const dynamicSlimmer = require('./dynamic-slimmer-dc30600a.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
 
 /**
  * returns a string that is a random UUID

package/dist/cjs/{date-ffe382a4.js → date-0a6bb035.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 
 /**
  * It returns true if the input is a valid date string, and false otherwise

package/dist/cjs/{deprecated-property-slimmer-f36e3779.js → deprecated-property-slimmer-fc729fd9.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
-const dynamicSlimmer = require('./dynamic-slimmer-dc30600a.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
 const object = require('./object-bbd4ed7f.js');
 
 /** DeprecatedPropertySlimmer compares new property with default value, if they are different, return new property; otherwise, return old property */

package/dist/cjs/{design-token-908e3f69.js → design-token-30c069c1.js}

@@ -2,10 +2,10 @@
 
 const typeGuard = require('./type-guard-4ba85fdc.js');
 const breakpoints = require('./breakpoints-ebde4837.js');
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
-const responsiveFormatFacade = require('./responsive-format-facade-74079f1b.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const responsiveFormatFacade = require('./responsive-format-facade-4363a00d.js');
 const typography = require('./typography-4560e7f1.js');
-const stateBackgroundColorFormatter = require('./state-background-color-formatter-d32a1098.js');
+const stateBackgroundColorFormatter = require('./state-background-color-formatter-e585a027.js');
 const ui = require('./ui-32e69595.js');
 
 /**

package/dist/cjs/{dom-node-subject-observer-factory-093462f1.js → dom-node-subject-factory-3ec114b8.js}

@@ -1,7 +1,6 @@
 'use strict';
 
-const changeManager = require('./change-manager-bda1d107.js');
-const ui = require('./ui-b5906704.js');
+const ui = require('./ui-5fd9b267.js');
 
 /**
  *  An Observer is a class that has a listener method that accepts a value of type T
@@ -230,45 +229,6 @@ class DomNodeSubjectFactory {
 }
 const domNodeSubjectFactory = new DomNodeSubjectFactory();
 
-/**
- * The function `domAcceptableHandle` always returns `true`.
- *
- * @returns {boolean} true
- */
-const domAcceptableHandle = () => {
-  return true;
-};
-/** The `DomNodeSubjectObserverFactory` class provides methods to add and remove observers to HTML element nodes. */
-class DomNodeSubjectObserverFactory {
-  /**
-   * add observer to a given HTML element node
-   *
-   * @param {HTMLElement} node the node ref
-   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
-   * @param {(input?: unknown) => void} callback the callback handle
-   * @param {(input?: unknown) => boolean} acceptableHandle the acceptable handle
-   */
-  static addUniqueObserverToNode(node, eventId, callback, acceptableHandle) {
-    if (node) {
-      const domNodesObserver = new Observer(typeof acceptableHandle === 'function' ? acceptableHandle.bind(null) : domAcceptableHandle, callback);
-      DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(node, eventId);
-      changeManager.ChangeManager.register(domNodeSubjectFactory.getSubject(node, eventId), domNodesObserver);
-    }
-  }
-  /**
-   * The function removes observers from a given HTML element node.
-   *
-   * @param {HTMLElement} node - The `node` parameter is an `HTMLElement` object representing an HTML element in the DOM (Document Object Model).
-   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
-   */
-  static removeUniqueObserverFromNode(node, eventId) {
-    if (domNodeSubjectFactory.isExist(node, eventId)) {
-      changeManager.ChangeManager.clearObserversBySubject(domNodeSubjectFactory.getSubject(node, eventId));
-    }
-  }
-}
-
-exports.DomNodeSubjectObserverFactory = DomNodeSubjectObserverFactory;
 exports.Observer = Observer;
 exports.VegaActionButtonClick = VegaActionButtonClick;
 exports.VegaActionClick = VegaActionClick;

package/dist/cjs/dom-node-subject-observer-factory-5f0eae19.js

@@ -0,0 +1,44 @@
+'use strict';
+
+const changeManager = require('./change-manager-a297e4d2.js');
+const domNodeSubjectFactory = require('./dom-node-subject-factory-3ec114b8.js');
+
+/**
+ * The function `domAcceptableHandle` always returns `true`.
+ *
+ * @returns {boolean} true
+ */
+const domAcceptableHandle = () => {
+  return true;
+};
+/** The `DomNodeSubjectObserverFactory` class provides methods to add and remove observers to HTML element nodes. */
+class DomNodeSubjectObserverFactory {
+  /**
+   * add observer to a given HTML element node
+   *
+   * @param {HTMLElement} node the node ref
+   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
+   * @param {(input?: unknown) => void} callback the callback handle
+   * @param {(input?: unknown) => boolean} acceptableHandle the acceptable handle
+   */
+  static addUniqueObserverToNode(node, eventId, callback, acceptableHandle) {
+    if (node) {
+      const domNodesObserver = new domNodeSubjectFactory.Observer(typeof acceptableHandle === 'function' ? acceptableHandle.bind(null) : domAcceptableHandle, callback);
+      DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(node, eventId);
+      changeManager.ChangeManager.register(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(node, eventId), domNodesObserver);
+    }
+  }
+  /**
+   * The function removes observers from a given HTML element node.
+   *
+   * @param {HTMLElement} node - The `node` parameter is an `HTMLElement` object representing an HTML element in the DOM (Document Object Model).
+   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
+   */
+  static removeUniqueObserverFromNode(node, eventId) {
+    if (domNodeSubjectFactory.domNodeSubjectFactory.isExist(node, eventId)) {
+      changeManager.ChangeManager.clearObserversBySubject(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(node, eventId));
+    }
+  }
+}
+
+exports.DomNodeSubjectObserverFactory = DomNodeSubjectObserverFactory;

package/dist/cjs/{dynamic-slimmer-dc30600a.js → dynamic-slimmer-f31fdfd7.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 
 /**
  * The `createDynamicSlimmer` function creates an instance of a dynamically generated class based on

package/dist/cjs/{element-appender-slimmer-0dd70e61.js → element-appender-slimmer-77f9c4a0.js}

@@ -1,13 +1,13 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
-const ui = require('./ui-b5906704.js');
-const internalVegaZIndexManager = require('./internal-vega-z-index-manager-e24e4309.js');
-const dynamicSlimmer = require('./dynamic-slimmer-dc30600a.js');
-const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-e54fa9d4.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const ui = require('./ui-5fd9b267.js');
+const internalVegaZIndexManager = require('./internal-vega-z-index-manager-f03ddb37.js');
+const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
+const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-bb1eaebe.js');
 const ui$1 = require('./ui-32e69595.js');
 const typeGuard = require('./type-guard-4ba85fdc.js');
-const responsiveFormatFacade = require('./responsive-format-facade-74079f1b.js');
+const responsiveFormatFacade = require('./responsive-format-facade-4363a00d.js');
 
 var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -813,7 +813,7 @@ class PositionCalculationController extends globalSlimmerRegistry.VegaSlimmer {
    * @returns {void}
    */
   adjustHeight() {
-    if (this.showConfig.matchContainerHeight) {
+    if (this.showConfig.matchContainerHeight && !this.showConfig.isScreenPosition) {
       const { height: targetHeight } = this.showConfig.target.getBoundingClientRect();
       let maxHeight = this.container.scrollHeight - this.showConfig.target.offsetTop - targetHeight;
       if (this.showConfig.maxHeight) {
@@ -1040,6 +1040,16 @@ class ElementAppender {
   prepareShow() {
     // Add relative position to the container while the container is static,
     // https://developer.mozilla.org/en-US/docs/Web/CSS/position#types_of_positioning
+    if (!this.showConfig.isScreenPosition) {
+      this.initVisibleAppendElement();
+    }
+    this.showConfig.appendableElement.style.boxSizing = 'border-box';
+    this.positionCalculationController.setCalculationStrategy();
+  }
+  /**
+   * init visible append element.
+   */
+  initVisibleAppendElement() {
     const containerStyle = window.getComputedStyle(this.container);
     const originContainerPosition = containerStyle.position;
     if (!ElementAppender.containerMap.has(this.container)) {
@@ -1051,8 +1061,6 @@ class ElementAppender {
     if (originContainerPosition === 'static') {
       this.container.style.position = 'relative';
     }
-    this.showConfig.appendableElement.style.boxSizing = 'border-box';
-    this.positionCalculationController.setCalculationStrategy();
   }
   /**
    * A function that takes no parameters and returns nothing. It sets the position of the appendable element.

package/dist/cjs/{event-emit-slimmer-a46bb411.js → event-emit-slimmer-9c223f73.js}

@@ -1,10 +1,11 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
-const dynamicSlimmer = require('./dynamic-slimmer-dc30600a.js');
-const changeManager = require('./change-manager-bda1d107.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-093462f1.js');
-const internalVegaEventManager = require('./internal-vega-event-manager-d7643ec6.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
+const changeManager = require('./change-manager-a297e4d2.js');
+const domNodeSubjectFactory = require('./dom-node-subject-factory-3ec114b8.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-5f0eae19.js');
+const internalVegaEventManager = require('./internal-vega-event-manager-e5e4bcf4.js');
 
 var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -165,7 +166,7 @@ class EventEmitSlimmerBase extends globalSlimmerRegistry.VegaSlimmer {
      * @returns {Nullable<Event>} The emitted event.
      */
     this.emit = (detail, e) => {
-      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.host, this.eventID), {
+      changeManager.ChangeManager.notify(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(this.host, this.eventID), {
         host: this.host,
         detail: detail,
         eventName: this.eventName,

package/dist/cjs/{feature-flag-controller-e97b5f29.js → feature-flag-controller-7b22e598.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const index = require('./index-8b247c17.js');
 
 /**

package/dist/cjs/{form-field-controller-slimmer-9aeabcdc.js → form-field-controller-slimmer-8d4d2723.js}

@@ -1,17 +1,18 @@
 'use strict';
 
-const globalSlimmerRegistry = require('./global-slimmer-registry-dd2691b8.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const string = require('./string-21427167.js');
-const changeManager = require('./change-manager-bda1d107.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-093462f1.js');
+const changeManager = require('./change-manager-a297e4d2.js');
+const domNodeSubjectFactory = require('./dom-node-subject-factory-3ec114b8.js');
 const staticSubjectTitle = require('./static-subject-title-d66b88fb.js');
-const ui = require('./ui-b5906704.js');
-const createPublicApiRuntimeMetricsSlimmer = require('./create-public-api-runtime-metrics-slimmer-8c6a8fb7.js');
-const dynamicSlimmer = require('./dynamic-slimmer-dc30600a.js');
-const vegaInternalEventId = require('./vega-internal-event-id-85b68849.js');
-const translation = require('./translation-f6b7ee84.js');
-const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-e54fa9d4.js');
-const mutationObserverSlimmer = require('./mutation-observer-slimmer-98bbbdf0.js');
+const ui = require('./ui-5fd9b267.js');
+const createPublicApiRuntimeMetricsSlimmer = require('./create-public-api-runtime-metrics-slimmer-54c3f73b.js');
+const dynamicSlimmer = require('./dynamic-slimmer-f31fdfd7.js');
+const vegaInternalEventId = require('./vega-internal-event-id-b12071ea.js');
+const translation = require('./translation-b9be41e0.js');
+const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-bb1eaebe.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-5f0eae19.js');
+const mutationObserverSlimmer = require('./mutation-observer-slimmer-895b3d3e.js');
 const mutationObserverFilters = require('./mutation-observer-filters-e5a7f85a.js');
 const array = require('./array-5adef7b2.js');
 
@@ -125,7 +126,7 @@ class FormFieldValidationRuleHandlerChain {
    * @param {(keyof FormFieldStatusMeta)[]} triggerStatus - These keys represent the fields that have triggered a change in status.
    * @param {boolean | 'rule'} showError - A boolean or string rule form method call, It's a param of callback.
    * @param {ValidationCallBack} callback - The method should be call when validation result is not valid.
-   * @returns {Promise<boolean>} validate result.
+   * @returns {Promise<EvaluateResult>} validate result.
    */
   async process(input, status, triggerStatus, showError, callback) {
     const UUID = this.preProcess();
@@ -154,7 +155,12 @@ class FormFieldValidationRuleHandlerChain {
       }
     }
     this.postProcess(UUID, showError, result, callback);
-    return result ? false : true;
+    if (result) {
+      return { isValid: false, message: result.message };
+    }
+    else {
+      return { isValid: true, message: '' };
+    }
   }
   /**
    * sets the processId to the UUID
@@ -251,6 +257,22 @@ class SiblingContainerErrorLabelContainerRetrievalStrategy {
   }
 }
 
+/** The `FormFieldMessageTranslatorSlimmer` class is to get translated message */
+class FormFieldMessageTranslatorSlimmer extends globalSlimmerRegistry.VegaSlimmer {
+  /**
+   * Translates a given message based on its type.
+   *
+   * @param {EvaluateResult['message'] | EvaluateResultTranslation['message']} message - The message to be translated, which can be a string or a TranslationMessage.
+   * @returns {string} The translated message.
+   */
+  getTranslatedMessage(message) {
+    if (typeof message === 'string') {
+      return translation.VegaInternalTranslation.t(message);
+    }
+    return translation.VegaInternalTranslation.t(message.key, ...(message.args || []));
+  }
+}
+
 var __decorate$4 = (undefined && undefined.__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);
@@ -261,6 +283,7 @@ var __decorate$4 = (undefined && undefined.__decorate) || function (decorators,
 class FieldErrorUIControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
   constructor() {
     super();
+    this.formFieldMessageTranslatorSlimmer = new FormFieldMessageTranslatorSlimmer();
     this.fieldErrorUiControllerStrategies = [
       new SiblingContainerNestedErrorContainerRetrievalStrategy(),
       new SiblingContainerSelfRetrievalStrategy(),
@@ -280,10 +303,11 @@ class FieldErrorUIControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
     const inputContainer = this.getInputElementContainer();
     if (errorMessage && inputContainer) {
       const errorContainer = this.getErrorContainer(inputContainer);
-      errorContainer.innerHTML = this.getTranslatedMessage(errorMessage);
+      errorContainer.innerHTML =
+        this.formFieldMessageTranslatorSlimmer.getTranslatedMessage(errorMessage);
       errorContainer.classList.remove('vega-hidden');
       inputContainer.classList.add('error');
-      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalFieldErrorStateChange), {
+      changeManager.ChangeManager.notify(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalFieldErrorStateChange), {
         host: this.host,
         showError: true,
       });
@@ -301,7 +325,7 @@ class FieldErrorUIControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
       const errorContainer = this.getErrorContainer(inputContainer);
       errorContainer.classList.add('vega-hidden');
       inputContainer.classList.remove('error');
-      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalFieldErrorStateChange), {
+      changeManager.ChangeManager.notify(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalFieldErrorStateChange), {
         host: this.host,
         showError: false,
       });
@@ -329,30 +353,19 @@ class FieldErrorUIControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
       }
     }
   }
-  /**
-   * Translates a given message based on its type.
-   *
-   * @param {EvaluateResult['message'] | EvaluateResultTranslation['message']} message - The message to be translated, which can be a string or a TranslationMessage.
-   * @returns {string} The translated message.
-   */
-  getTranslatedMessage(message) {
-    if (typeof message === 'string') {
-      return translation.VegaInternalTranslation.t(message);
-    }
-    return translation.VegaInternalTranslation.t(message.key, ...(message.args || []));
-  }
   /**
    * Init translation observer of translation language changes
    */
   initTranslationObserver() {
-    const observer = new domNodeSubjectObserverFactory.Observer(this.isAcceptableTranslationObserver.bind(this), () => {
+    const observer = new domNodeSubjectFactory.Observer(this.isAcceptableTranslationObserver.bind(this), () => {
       if (!this.errorMessage)
         return;
       const inputContainer = this.getInputElementContainer();
       if (inputContainer) {
         const errorContainer = this.getErrorContainer(inputContainer);
         if (errorContainer) {
-          errorContainer.innerHTML = this.getTranslatedMessage(this.errorMessage);
+          errorContainer.innerHTML =
+            this.formFieldMessageTranslatorSlimmer.getTranslatedMessage(this.errorMessage);
         }
       }
     });
@@ -367,6 +380,9 @@ class FieldErrorUIControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
     return true;
   }
 }
+__decorate$4([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], FieldErrorUIControllerSlimmer.prototype, "formFieldMessageTranslatorSlimmer", void 0);
 __decorate$4([
   globalSlimmerRegistry.MapToComponentField()
 ], FieldErrorUIControllerSlimmer.prototype, "host", void 0);
@@ -408,6 +424,7 @@ class FormFieldController {
    */
   constructor(defaultRules, hostElement, defaultValue, options) {
     var _a, _b;
+    this.formFieldMessageTranslatorSlimmer = new FormFieldMessageTranslatorSlimmer();
     this.fieldErrorUIController = new FieldErrorUIControllerSlimmer();
     this.resizeObserverSlimmer = dynamicSlimmer.createDynamicSlimmer(FormFieldController, pageResizeObserverSlimmer.PageResizeObserverSlimmer, [], [{ mapFrom: 'connectResizeObserver', mapTo: 'connectResizeObserver' }], [
       {
@@ -499,7 +516,7 @@ class FormFieldController {
    * It validates the input against the rules and returns a boolean indicating whether the input is valid or not
    *
    * @param {boolean} showError whether the validation result should be reflected in UI
-   * @returns {boolean} A boolean value.
+   * @returns {Promise<EvaluateResultBase>} A promise value.
    */
   async validate(showError) {
     return await this.valid([], showError);
@@ -573,8 +590,9 @@ class FormFieldController {
     if (hasAsyncRules) {
       changeManager.ChangeManager.notify(staticSubjectTitle.FORM_FIELD_PENDING_VALID_CHANGE, { host: this.host, detail: null });
     }
-    const isValid = await this.formFieldValidationRuleHandlerChain.process(input, status, triggerStatus, showError, this.handleValidationResult);
-    return isValid;
+    const { isValid, message } = await this.formFieldValidationRuleHandlerChain.process(input, status, triggerStatus, showError, this.handleValidationResult);
+    const translatedMessage = this.formFieldMessageTranslatorSlimmer.getTranslatedMessage(message);
+    return { isValid, message: translatedMessage };
   }
   /**
    * Invoke all listeners with the given isValid value
@@ -688,7 +706,7 @@ class FormFieldController {
    * When that event is fired, the `updateIsModified` function is called with the argument `true`
    */
   setupModifiedListener() {
-    this.hostValueChangeObserver = new domNodeSubjectObserverFactory.Observer(this.isCurrentTarget.bind(this), () => this.updateIsModified(true));
+    this.hostValueChangeObserver = new domNodeSubjectFactory.Observer(this.isCurrentTarget.bind(this), () => this.updateIsModified(true));
     changeManager.ChangeManager.register(staticSubjectTitle.FORM_ELEMENT_VALUE_CHANGE, this.hostValueChangeObserver);
   }
   /**
@@ -741,7 +759,7 @@ class FormFieldController {
    * reset operation is triggered
    */
   initFormResetObserver() {
-    this.formResetTriggeredObserver = new domNodeSubjectObserverFactory.Observer(this.canAcceptFormResetOperation.bind(this), this.reset.bind(this));
+    this.formResetTriggeredObserver = new domNodeSubjectFactory.Observer(this.canAcceptFormResetOperation.bind(this), this.reset.bind(this));
     changeManager.ChangeManager.register(staticSubjectTitle.FORM_RESET_OPERATION_TRIGGERED, this.formResetTriggeredObserver);
   }
   /**
@@ -799,11 +817,16 @@ class FormFieldController {
         if (isSubmittedKey)
           event.preventDefault();
         return isSubmittedKey;
+      case 'VEGA-RICH-TEXT-EDITOR':
+        return false;
       default:
         return isEnterKey;
     }
   }
 }
+__decorate$3([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], FormFieldController.prototype, "formFieldMessageTranslatorSlimmer", void 0);
 __decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], FormFieldController.prototype, "fieldErrorUIController", void 0);
@@ -817,13 +840,19 @@ var __decorate$2 = (undefined && undefined.__decorate) || function (decorators,
   else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-/** The `FieldBoxControllerSlimmer` class is a TypeScript class that extends the `VegaSlimmer` class and provides methods for handling error UI in a field error component. */
+/**
+ * The current class is used to manually control the form element error message.
+ * The component `vega-field-error` is used to control the error messages for form fields. to implement the error message display, we needs to know the form field error message container, field element, and other necessary options,
+ * the `form-field-controller-slimmer` has the required options and will inject to the all form fields, so we create current slimmer class and inject to the `form-field-controller-slimmer` to get all options.
+ * When the property `message` of the vega-field-error component changed, the target form field will receive the special subject and update the error message.
+ */
 class FieldErrorControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
   constructor() {
     super(...arguments);
+    // The host element field error UI controller.
     this.fieldErrorUIController = new FieldErrorUIControllerSlimmer();
     /**
-     * call the method when observer trigger
+     * This method called mean that the current form field element nest in a vega-field-error component and the parent component property `message` changed, we need to show or hide the error message.
      *
      * @param {FieldErrorEventPayload} payload payload param
      */
@@ -841,7 +870,7 @@ class FieldErrorControllerSlimmer extends globalSlimmerRegistry.VegaSlimmer {
    * register the observer when the slimmer method called
    */
   handleComponentWillLoadByFieldErrorSlimmer() {
-    this.fieldErrorMessageChangeObserver = new domNodeSubjectObserverFactory.Observer(this.canAcceptFieldErrorMessageUpdate.bind(this), this.handleFieldErrorMessageUpdate);
+    this.fieldErrorMessageChangeObserver = new domNodeSubjectFactory.Observer(this.canAcceptFieldErrorMessageUpdate.bind(this), this.handleFieldErrorMessageUpdate);
     changeManager.ChangeManager.register(staticSubjectTitle.FIELD_ERROR_MESSAGE_CHANGE, this.fieldErrorMessageChangeObserver);
   }
   /**
@@ -901,9 +930,12 @@ class FormFieldValidInvokeSlimmer extends globalSlimmerRegistry.VegaSlimmer {
         if (payload.timerId !== undefined) {
           clearTimeout(payload.timerId);
         }
-        const isValid = await this.validator.validate(payload.message);
-        if (typeof payload.promiseResolve === 'function') {
-          payload.promiseResolve(isValid);
+        const validationResult = await this.validator.validate(payload.message);
+        if (validationResult) {
+          const { isValid, message } = validationResult;
+          if (typeof payload.promiseResolve === 'function') {
+            payload.promiseResolve({ isValid, message });
+          }
         }
       }
     };