@globalpayments/vega 2.25.0 → 2.27.0

package/dist/collection/components/vega-input-credit-card/vega-input-credit-card.js

@@ -23,7 +23,7 @@ import { FeatureFlag } from '../../helpers/feature-control/feature-flag-controll
 import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
 import { VegaInputCreditCardRuntimeMetricsPayloadDefinition } from '../../constants/runtime-metrics-payload-definition/vega-input-credit-card/runtime-metrics-payload-definition';
 /**
- * @version 1.26.0
+ * @vegaVersion 1.26.0
  */
 export class VegaInputCreditCard {
   constructor() {
@@ -65,33 +65,33 @@ export class VegaInputCreditCard {
      * Specifies whether a card number must be entered for
      *    this component to pass form validation.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.required = false;
     /**
      * Determines whether the credit card input field is disabled.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.disabled = false;
     /**
      * Defines the label or title for the credit card input field.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.label = '';
     /**
      * Provides a supplementary prompt message that assists users in
      *    understanding the expected value for the input field.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.hint = '';
     /**
      * Specifies the size of the credit card input field.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.size = 'default';
     /**
@@ -100,7 +100,7 @@ export class VegaInputCreditCard {
      *
      * It indicates the expected format or pattern of the credit card input.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.placeholder = '';
     /**
@@ -111,27 +111,27 @@ export class VegaInputCreditCard {
      *    with the first three fields displayed as "x" and
      *    the last field remaining visible during blur and upon initial loading.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.hideCardNumberOnBlur = true;
     /**
      * Determines whether the user's input in the credit card field should
      *    be automatically validated.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.autoValidation = true;
     /**
      * Specifies custom validation rules for the credit card input field.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.validationRules = [];
     /**
      * Indicates whether the current value in the field is considered valid
      *    based on the defined validation rules.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.isValid = null;
@@ -142,7 +142,7 @@ export class VegaInputCreditCard {
      *    which is displayed to the user when the
      *    input is initially rendered.
      *
-     * @version 1.26.0
+     * @vegaVersion 1.26.0
      */
     this.value = '';
     this.renderInputContainer = () => {
@@ -259,7 +259,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Specifies whether a card number must be entered for\n   this component to pass form validation."
@@ -280,7 +280,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Determines whether the credit card input field is disabled."
@@ -301,7 +301,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Defines the label or title for the credit card input field."
@@ -322,7 +322,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Provides a supplementary prompt message that assists users in\n   understanding the expected value for the input field."
@@ -343,7 +343,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Specifies the size of the credit card input field."
@@ -364,7 +364,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Specifies a placeholder string that displays as a temporary hint or\n   example inside the credit card input field.\n\nIt indicates the expected format or pattern of the credit card input."
@@ -385,7 +385,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Specifies whether to hide the credit card number when\n   users focus out of the input field.\n\nWhen set to `true`, the credit card number is partially masked,\n   with the first three fields displayed as \"x\" and\n   the last field remaining visible during blur and upon initial loading."
@@ -406,7 +406,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Determines whether the user's input in the credit card field should\n   be automatically validated."
@@ -432,7 +432,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Specifies custom validation rules for the credit card input field."
@@ -451,7 +451,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Indicates whether the current value in the field is considered valid\n   based on the defined validation rules."
@@ -472,7 +472,7 @@ export class VegaInputCreditCard {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "Represents a pre-set value for the credit card input field.\n\nIt allows you to initialize the field with a specific value,\n   which is displayed to the user when the\n   input is initially rendered."
@@ -490,7 +490,7 @@ export class VegaInputCreditCard {
       "composed": true,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "An event emitter notifying a value change."
@@ -511,7 +511,7 @@ export class VegaInputCreditCard {
             "name": "eventSemantics",
             "text": "namespace:native"
           }, {
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.0.0"
           }],
         "text": "A native change event emitter notifying a value change."
@@ -529,7 +529,7 @@ export class VegaInputCreditCard {
       "composed": true,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "An event emitter notifying the blur event of the credit card element."
@@ -550,7 +550,7 @@ export class VegaInputCreditCard {
             "name": "eventSemantics",
             "text": "namespace:native"
           }, {
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.0.0"
           }],
         "text": "An event emitter notifying the blur event of the credit card element."
@@ -568,7 +568,7 @@ export class VegaInputCreditCard {
       "composed": true,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "1.26.0"
           }],
         "text": "An event emitter notifying the focus of the credit card element."
@@ -589,7 +589,7 @@ export class VegaInputCreditCard {
             "name": "eventSemantics",
             "text": "namespace:native"
           }, {
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.0.0"
           }],
         "text": "An event emitter notifying the focus of the credit card element."

package/dist/collection/components/vega-input-phone-number/slimmers/controllers/country-select-controller.js

@@ -4,21 +4,37 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
   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, VegaSlimmer } from 'vega-slimmer/core';
+import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
 import { getCountries } from 'libphonenumber-js';
-import staticRemoteInvocationCallRegistry from '../../../../helpers/change-manager/subject/static-remote-invocation-subject/static-remote-invocation-call-registry';
-import { DROPDOWN_SEARCH_INTERNAL_OVERRIDEN } from '../../../../helpers/change-manager/subject/static-subject/static-subject-title';
+import remoteInvocationRegistry from '../../../../helpers/remote-invocation/remote-invocation-registry';
 import { COUNTRIES } from '../../assets/countries';
+import { VegaDropdownSearchInternalOverridden } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
 /**
  * The `CountrySelectController` class in TypeScript includes methods to set the search string and
  * countryCode properties.
  */
 export class CountrySelectController extends VegaSlimmer {
+  /**
+   * Component lifecycle - connectedCallback
+   */
+  connectedCallback() {
+    this.registerRemoteDropdownSearch();
+  }
+  /**
+   * The function `setCountryCode` sets the countryCode property of an object to the specified VegaCountryCode value.
+   *
+   * @param {VegaCountryCode} countryCode - The `countryCode` parameter is of type `VegaCountryCode`, which is likely a
+   * custom data type representing a country code.
+   */
+  setCountryCode(countryCode) {
+    this.countryCode = countryCode;
+  }
   /**
    * Registers a remote invocation call for a dropdown search.
    */
-  static registerRemoteDropdownSearch() {
-    staticRemoteInvocationCallRegistry.register(DROPDOWN_SEARCH_INTERNAL_OVERRIDEN, this.filterDropdownSourcesBySearchString.bind(this));
+  registerRemoteDropdownSearch() {
+    remoteInvocationRegistry.register(domNodeSubjectFactory.getSubject(this.host, VegaDropdownSearchInternalOverridden), this.filterDropdownSourcesBySearchString.bind(this));
   }
   /**
    * Remote invocation call for a dropdown search.
@@ -27,24 +43,20 @@ export class CountrySelectController extends VegaSlimmer {
    * @param {string} searchString - Searching string of dropdown.
    * @returns  {DropdownSourceItem[]}  The searched source.
    */
-  static filterDropdownSourcesBySearchString(source, searchString) {
+  filterDropdownSourcesBySearchString(source, searchString) {
     return source.filter((item) => `${COUNTRIES[item.key].toLowerCase()} +${item.label}`
       .toLowerCase()
       .includes(searchString.toLowerCase()));
   }
-  /**
-   * The function `setCountryCode` sets the countryCode property of an object to the specified VegaCountryCode value.
-   *
-   * @param {VegaCountryCode} countryCode - The `countryCode` parameter is of type `VegaCountryCode`, which is likely a
-   * custom data type representing a country code.
-   */
-  setCountryCode(countryCode) {
-    this.countryCode = countryCode;
-  }
 }
 CountrySelectController.defaultCountryCode = 'US';
 CountrySelectController.defaultAllowedCountryCodes = getCountries();
 __decorate([
   MapToComponentField({ writable: true })
 ], CountrySelectController.prototype, "countryCode", void 0);
-CountrySelectController.registerRemoteDropdownSearch();
+__decorate([
+  MapToComponentField()
+], CountrySelectController.prototype, "host", void 0);
+__decorate([
+  MapToComponentMethod('connectedCallback')
+], CountrySelectController.prototype, "connectedCallback", null);

package/dist/collection/components/vega-input-phone-number/slimmers/controllers/vega-input-phone-number-value-controller.js

@@ -38,19 +38,23 @@ export class VegaInputPhoneNumberValueController extends VegaSlimmer {
     this.updateValue(this.value);
   }
   /**
-   * The `watchValue` function emits a change event with the provided value and notifies the
-   * ChangeManager about the form element value change.
+   * The `watchValue` function updates a value and emits change events based on certain conditions.
    *
-   * @param {string} value - The `value` parameter is a string that represents the value being watched or
-   * monitored.
+   * @param {string} newValue - The `newValue` parameter represents the new value that is being watched
+   * for changes.
+   * @param {string} oldValue - The `oldValue` parameter in the `watchValue` function represents the
+   * previous value before the update. It is used to compare with the new value (`newValue`) to determine
+   * if there has been a change in the value.
    */
-  watchValue(value) {
-    this.updateValue(value);
-    this.changeEventEmitter.emit(value);
-    ChangeManager.notify(FORM_ELEMENT_VALUE_CHANGE, {
-      host: this.host,
-      detail: value,
-    });
+  watchValue(newValue, oldValue) {
+    this.updateValue(newValue);
+    if (oldValue && oldValue !== this.value) {
+      this.changeEventEmitter.emit(this.value);
+      ChangeManager.notify(FORM_ELEMENT_VALUE_CHANGE, {
+        host: this.host,
+        detail: this.value,
+      });
+    }
   }
   /**
    * The function `getCallingCodePrefix` returns the calling code prefix for a given country code.

package/dist/collection/components/vega-input-phone-number/slimmers/renderers/country-select-renderer.js

@@ -12,8 +12,9 @@ import { VegaInternalIconManager } from '../../../../helpers/icon/internal-icon-
 import { CountryFlags } from '../../assets/country-flags';
 import { getCountryCallingCode } from 'libphonenumber-js';
 import { COUNTRIES } from '../../assets/countries';
-import staticRemoteInvocationCallRegistry from '../../../../helpers/change-manager/subject/static-remote-invocation-subject/static-remote-invocation-call-registry';
-import { DROPDOWN_RENDER_ITEM_INTERNAL_OVERRIDEN } from '../../../../helpers/change-manager/subject/static-subject/static-subject-title';
+import remoteInvocationRegistry from '../../../../helpers/remote-invocation/remote-invocation-registry';
+import { VegaDropdownRenderItemInternalOverridden } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
 export class CountrySelectRenderer extends VegaSlimmer {
   constructor() {
     super(...arguments);
@@ -87,7 +88,7 @@ export class CountrySelectRenderer extends VegaSlimmer {
           (e) => {
             this.handleCountrySelectChange(e.detail);
           });
-          staticRemoteInvocationCallRegistry.register(DROPDOWN_RENDER_ITEM_INTERNAL_OVERRIDEN, this.renderDropdownItem.bind(this));
+          remoteInvocationRegistry.register(domNodeSubjectFactory.getSubject(this.host, VegaDropdownRenderItemInternalOverridden), this.renderDropdownItem.bind(this));
         }, value: this.countryCode })));
   }
   /*
@@ -144,6 +145,9 @@ export class CountrySelectRenderer extends VegaSlimmer {
   VegaInternalIconManager.register(CountryFlags);
 })();
 CountrySelectRenderer.allCountries = COUNTRIES;
+__decorate([
+  MapToComponentField()
+], CountrySelectRenderer.prototype, "host", void 0);
 __decorate([
   MapToComponentField()
 ], CountrySelectRenderer.prototype, "size", void 0);

package/dist/collection/components/vega-input-phone-number/vega-input-phone-number.js

@@ -21,7 +21,7 @@ import { VegaChange, VegaCountryChange } from '../../helpers/event-manager/event
 import { InputPhoneNumberRequiredRule } from '../../helpers/validator/rules/input-phone-number-required-rule';
 import { ChildNodesEventPreventSlimmer } from '../../helpers/event-manager/slimmers/child-nodes-event-prevent-slimmer';
 /**
- * @version 2.18.0
+ * @vegaVersion 2.18.0
  */
 export class VegaInputPhoneNumber {
   constructor() {
@@ -65,32 +65,32 @@ export class VegaInputPhoneNumber {
      * It provides descriptive text that helps identify the
      *    purpose or content expected in the input field.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.label = '';
     /**
      * Specifies the size of the phone number input field.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.size = 'default';
     /**
      * Determines whether the phone number input field is required.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.required = false;
     /**
      * Determines whether the phone number input field is disabled.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.disabled = false;
     /**
      * Specifies the default country calling code using the two-letter uppercase country code.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.countryCode = CountrySelectController.defaultCountryCode;
@@ -99,27 +99,28 @@ export class VegaInputPhoneNumber {
      *
      * Note: By default, 245 codes are provided, but loading all of them may take time. To improve performance, it is recommended to include only the necessary codes.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.allowedCountryCodes = CountrySelectController.defaultAllowedCountryCodes;
     /**
      * Specifies the value of the phone number input in [E.164]{@link https://en.wikipedia.org/wiki/E.164} format.
      *
-     * @version 2.18.0
+     * @VegaWarning Note: The input phone number field will always have a value. If no phone number is entered, the default format is `+{default_country_code}`. For example, if the default country code is US, the default value will be `+1`.
+     * @vegaVersion 2.18.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.value = `+${getCountryCallingCode(this.countryCode)}`;
     /**
      * Specifies custom validation rules for the phone number input field.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.validationRules = [];
     /**
      * Indicates whether the current value in the field is considered valid
      *    based on the defined validation rules.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     /* eslint-disable-next-line @stencil/strict-mutable */
     this.isValid = null;
@@ -127,22 +128,22 @@ export class VegaInputPhoneNumber {
      * Determines whether the phone number input field should undergo automatic validation
      *    during the user's input.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.autoValidation = true;
     /**
      * Provides a supplementary prompt message that assists users in
      *    understanding the expected value for the input field.
      *
-     * @version 2.18.0
+     * @vegaVersion 2.18.0
      */
     this.hint = '';
   }
   watchCountryCode(newCountryCode, oldCountryCode) {
     methodPlaceholder(newCountryCode, oldCountryCode);
   }
-  watchValue(value) {
-    methodPlaceholder(value);
+  watchValue(newValue, oldValue) {
+    methodPlaceholder(newValue, oldValue);
   }
   watchValidationRules() {
     methodPlaceholder();
@@ -171,7 +172,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies the label or title for the phone number input field.\n\nIt provides descriptive text that helps identify the\n   purpose or content expected in the input field."
@@ -192,7 +193,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies the size of the phone number input field."
@@ -213,7 +214,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Determines whether the phone number input field is required."
@@ -234,7 +235,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Determines whether the phone number input field is disabled."
@@ -260,7 +261,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies the default country calling code using the two-letter uppercase country code."
@@ -286,7 +287,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies the countries available for selection.\n\nNote: By default, 245 codes are provided, but loading all of them may take time. To improve performance, it is recommended to include only the necessary codes."
@@ -305,7 +306,10 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "VegaWarning",
+            "text": "Note: The input phone number field will always have a value. If no phone number is entered, the default format is `+{default_country_code}`. For example, if the default country code is US, the default value will be `+1`."
+          }, {
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies the value of the phone number input in [E.164]{@link https ://en.wikipedia.org/wiki/E.164} format."
@@ -331,7 +335,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies custom validation rules for the phone number input field."
@@ -350,7 +354,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Indicates whether the current value in the field is considered valid\n   based on the defined validation rules."
@@ -371,7 +375,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Determines whether the phone number input field should undergo automatic validation\n   during the user's input."
@@ -392,7 +396,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Specifies a placeholder string that displays as a temporary hint\n   or example inside the input field."
@@ -412,7 +416,7 @@ export class VegaInputPhoneNumber {
       "optional": false,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "Provides a supplementary prompt message that assists users in\n   understanding the expected value for the input field."
@@ -433,7 +437,7 @@ export class VegaInputPhoneNumber {
       "composed": true,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "An event emitter notifying a value change."
@@ -454,7 +458,7 @@ export class VegaInputPhoneNumber {
             "name": "eventSemantics",
             "text": "namespace:native"
           }, {
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "An event emitter notifying a value change."
@@ -472,7 +476,7 @@ export class VegaInputPhoneNumber {
       "composed": true,
       "docs": {
         "tags": [{
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "An event emitter notifying a country change."
@@ -498,7 +502,7 @@ export class VegaInputPhoneNumber {
             "name": "eventSemantics",
             "text": "namespace:native"
           }, {
-            "name": "version",
+            "name": "vegaVersion",
             "text": "2.18.0"
           }],
         "text": "An event emitter notifying a country change."

package/dist/collection/components/vega-input-range/slimmers/renderers/vega-input-range-input-renderer.js

@@ -94,7 +94,7 @@ export class VegaInputRangeInputRenderer extends VegaSlimmer {
    */
   getPlaceholderByIndex(index) {
     const placeholder = this.placeholder || VegaInputRangeInputRenderer.defaultPlaceholder;
-    return placeholder[index];
+    return this.translationSlimmer.t(placeholder[index]);
   }
   /**
    * get the input value by the input range index
@@ -138,3 +138,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaInputRangeInputRenderer.prototype, "clearIconRenderer", void 0);
+__decorate([
+  MapToComponentField()
+], VegaInputRangeInputRenderer.prototype, "translationSlimmer", void 0);