@globalpayments/vega 2.26.0 → 2.28.0

package/dist/collection/helpers/slimmers/sub-state/sub-state-observer-slimmer.js

@@ -26,7 +26,7 @@ export class SubStateObserverSlimmer extends VegaSlimmer {
      * @returns {boolean} a boolean value indicating whether the input is an acceptable observer payload.
      */
     this.isAcceptableObserverPayload = (input) => {
-      return input['host'] === this.parent;
+      return typeof input === 'object' && !!input && input['host'] === this.parent;
     };
     this.observerEntry = observerEntry;
   }
@@ -68,7 +68,7 @@ export class SubStateObserverSlimmer extends VegaSlimmer {
    * The function `getParent` returns the parent element of a given host element, based on the observer
    * entry and appender element.
    *
-   * @returns {HTMLElement} the parent HTMLElement.
+   * @returns {Nullable<HTMLElement>} the parent HTMLElement.
    */
   getParent() {
     if (typeof this.observerEntry.parent === 'string') {

package/dist/collection/helpers/slimmers/test/string-input-formatter-slimmer.test.js

@@ -183,4 +183,24 @@ describe('StringInputFormatterSlimmer test suite', () => {
     expect(formatSpy).toHaveBeenCalledWith('');
     expect(inputEl.value).toEqual('');
   });
+  test('should work proper while formatter have not implement calculateCaretPosition method', () => {
+    class FormatterSlimmer {
+      format(input) {
+        return input;
+      }
+    }
+    const mockedComponent = new MockedComponent();
+    mockedComponent.host = document.createElement('input');
+    const stringFormatStrategy = new FormatterSlimmer();
+    const inputEl = createMockedInput();
+    inputEl.value = '1111111111';
+    inputEl.selectionStart = inputEl.value.length;
+    mockedComponent['stringFormatter']['inputRef'] = inputEl;
+    mockedComponent['stringFormatter']['inputStrategy'] = stringFormatStrategy;
+    mockedComponent['stringFormatter'].setup();
+    const inputEvent = new Event('input');
+    inputEl.dispatchEvent(inputEvent);
+    expect(inputEl.value).toEqual('1111111111');
+    expect(inputEl.selectionStart).toEqual(10);
+  });
 });

package/dist/collection/helpers/slimmers/test/translation-slimmer.test.js

@@ -0,0 +1,89 @@
+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 { MockHTMLElement } from '@stencil/core/mock-doc';
+import { InjectVegaSlimmer } from 'vega-slimmer/core';
+import { TranslationSlimmer } from '../translation';
+import { VegaInternalTranslation } from '../../translation';
+import { VegaTranslationResourceEN } from '../../public-api';
+describe('TranslationSlimmer', () => {
+  const connectedCallback = jest.fn();
+  const disconnectedCallback = jest.fn();
+  class MockedComponent {
+    constructor() {
+      this.host = new MockHTMLElement('body', 'mocked-component');
+      this.translationSlimmer = new TranslationSlimmer();
+      this.connectedCallback();
+    }
+    connectedCallback() {
+      connectedCallback();
+    }
+    disconnectedCallback() {
+      disconnectedCallback();
+    }
+    render() {
+      const mockedText = 'Mocked Text';
+      const mockedTextWithArgs = 'Mocked Text {0}';
+      return [
+        this.translationSlimmer.t('This field is required'),
+        this.translationSlimmer.t('The minimum input value is {0}', 10),
+        this.translationSlimmer.t(mockedText),
+        this.translationSlimmer.t(mockedTextWithArgs, 2),
+      ];
+    }
+  }
+  __decorate([
+    InjectVegaSlimmer()
+  ], MockedComponent.prototype, "translationSlimmer", void 0);
+  beforeEach(() => {
+    connectedCallback.mockClear();
+    disconnectedCallback.mockClear();
+    /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    const resources = {
+      en: VegaTranslationResourceEN,
+      fr: {
+        'This field is required': 'Ce champ est obligatoire',
+        'The minimum input value is {0}': "La valeur minimale d'entrée est {0}",
+        'Mocked Text': 'Texte moqué',
+        'Mocked Text {0}': 'Texte moqué {0}',
+      },
+    };
+    /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    VegaInternalTranslation.init({ resources, language: 'en' });
+  });
+  it('should get translated text as expected', () => {
+    const component1 = new MockedComponent();
+    expect(component1.render()).toEqual([
+      'This field is required',
+      'The minimum input value is 10',
+      'Mocked Text',
+      'Mocked Text 2',
+    ]);
+    VegaInternalTranslation.changeLanguage('fr');
+    /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    expect(component1.render()).toEqual([
+      'Ce champ est obligatoire',
+      "La valeur minimale d'entrée est 10",
+      'Texte moqué',
+      'Texte moqué 2',
+    ]);
+    /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    expect(VegaInternalTranslation.getConnectedComponents().get('MOCKED-COMPONENT').size).toEqual(1);
+    component1.disconnectedCallback();
+  });
+  it('should work as expected when call disconnectedCallback', () => {
+    const component1 = new MockedComponent();
+    const component2 = new MockedComponent();
+    expect(VegaInternalTranslation.getConnectedComponents().get('MOCKED-COMPONENT').size).toEqual(0);
+    component1.render();
+    expect(VegaInternalTranslation.getConnectedComponents().get('MOCKED-COMPONENT').size).toEqual(1);
+    component2.render();
+    expect(VegaInternalTranslation.getConnectedComponents().get('MOCKED-COMPONENT').size).toEqual(2);
+    component1.disconnectedCallback();
+    expect(disconnectedCallback).toBeCalledTimes(1);
+    expect(VegaInternalTranslation.getConnectedComponents().get('MOCKED-COMPONENT').size).toEqual(1);
+  });
+});

package/dist/collection/helpers/slimmers/translation/index.js

@@ -0,0 +1 @@
+export { TranslationSlimmer } from './translation-slimmer';

package/dist/collection/helpers/slimmers/translation/translation-slimmer.js

@@ -0,0 +1,37 @@
+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, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+import { VegaInternalTranslation } from '../../translation';
+/**
+ * Translation slimmer for components to use.
+ * Automatically triggers re-render in components that rely on this utility when the language changes.
+ */
+export class TranslationSlimmer extends VegaSlimmer {
+  /**
+   * Component lifecycle - [disconnectedCallback]
+   */
+  disconnectedCallback() {
+    VegaInternalTranslation.unRegisterComponent(this.host);
+  }
+  /**
+   * Retrieves the translated string for the given key based on the current language.
+   *
+   * @param {string} key - The key for the translation.
+   * @param {unknown[]} args - A list of values to replace in the translation string.
+   * @returns {string} The translated string or the key itself if not found.
+   */
+  t(key, ...args) {
+    VegaInternalTranslation.registerComponent(this.host);
+    return VegaInternalTranslation.t(key, ...args);
+  }
+}
+__decorate([
+  MapToComponentField()
+], TranslationSlimmer.prototype, "host", void 0);
+__decorate([
+  MapToComponentMethod('disconnectedCallback')
+], TranslationSlimmer.prototype, "disconnectedCallback", null);

package/dist/collection/helpers/theme/theme-manager.js

@@ -20,6 +20,7 @@ class ThemeManager {
    * It takes the colors you passed in, parses them into the correct format, and then applies them to the theme
    *
    * @param {VegaThemeOverrideColors} overrideColors - OverrideColors - This is the object that you pass to the function.
+   * @vegaVersion 1.20.0
    */
   async overrideColors(overrideColors) {
     const overrideThemes = VegaColorSchemaOverridingController.generateOverrideThemes(overrideColors);
@@ -27,6 +28,8 @@ class ThemeManager {
   }
   /**
    * It removes all the custom override theme styles from the DOM
+   *
+   * @vegaVersion 1.20.0
    */
   async reset() {
     VegaColorSchemaOverridingController.getOverrideThemeContainer().innerHTML = '';
@@ -37,6 +40,7 @@ class ThemeManager {
    * @param {boolean | undefined} darkMode - A boolean or undefined value that determines whether to enable or disable dark mode.
    * If it is true, dark mode is enabled.
    * If it is false, dark mode is disabled.
+   * @vegaVersion 1.32.0
    */
   toggleDarkMode(darkMode) {
     if (darkMode) {
@@ -52,6 +56,7 @@ class ThemeManager {
    *
    * @returns {boolean} A boolean value indicating whether the HTML element has a class of "dark", which is
    * typically used to indicate that the website is in dark mode.
+   * @vegaVersion 1.32.0
    */
   isDarkMode() {
     return document.documentElement.classList.contains('dark');

package/dist/collection/helpers/translation/index.js

@@ -0,0 +1,4 @@
+export * from './interface';
+export { default as en } from './locales/en';
+export { VegaTranslation } from './translation';
+export { VegaInternalTranslation } from './internal-translation-controller';

package/dist/collection/helpers/translation/internal-translation-controller.js

@@ -0,0 +1,104 @@
+import en from './locales/en';
+import { LogUtility } from '../../utils/log';
+import ChangeManager from '../change-manager/change-manager';
+import { UPDATE_TRANSLATION } from '../change-manager/subject/static-subject/static-subject-title';
+/**
+ * Vega translation controller to control the internal text translation
+ */
+class InternalTranslationController {
+  constructor() {
+    this.resources = { en };
+    this._currentLanguage = 'en';
+  }
+  /**
+   * Get current language
+   *
+   * @returns {string} current language
+   */
+  get currentLanguage() {
+    return this._currentLanguage;
+  }
+  /**
+   * Initializes the translation controller with provided resources and language.
+   *
+   * @param {VegaTranslationConfig} config - The configuration object containing resources and initial language.
+   */
+  init({ resources, language }) {
+    if (resources && Object.keys(resources).length > 0) {
+      this.resources = resources;
+    }
+    else {
+      LogUtility.warn(`Resources are empty. Falling back to default language "en".`);
+      this.resources = { en };
+    }
+    if (language && language in this.resources) {
+      this._currentLanguage = language;
+    }
+    else {
+      LogUtility.warn(`Language "${language}" not found in resources. Falling back to default language "en".`);
+      this._currentLanguage = 'en';
+    }
+    ChangeManager.notify(UPDATE_TRANSLATION, {});
+  }
+  /**
+   * Changes the current language if it exists in the resources.
+   *
+   * @param {string} language - The language code to change to.
+   */
+  changeLanguage(language) {
+    if (this.resources[language]) {
+      this._currentLanguage = language;
+      ChangeManager.notify(UPDATE_TRANSLATION, {});
+    }
+    else {
+      LogUtility.warn(`Language "${language}" not found in resources.`);
+    }
+  }
+  /**
+   * Retrieves the translated string for the given key based on the current language.
+   *
+   * @param {string} key - The key for the translation.
+   * @param {unknown[]} args - A list of values to replace in the translation string.
+   * @returns {string} The translated string or the key itself if not found.
+   */
+  t(key, ...args) {
+    const translation = this.resources[this._currentLanguage][key] || en[key] || key;
+    return args.reduce((result, arg, index) => result.replace(new RegExp(`\\{${index}\\}`, 'g'), String(arg)), translation);
+  }
+  /**
+   * Registers a component to the `connectedComponents` map, associating it with the component's tag name.
+   * If the tag already exists, it adds the component to the existing set of components.
+   *
+   * @param {HTMLStencilElement} host - The component instance to register.
+   */
+  registerComponent(host) {
+    const connectedComponents = InternalTranslationController.connectedComponents.get(host.tagName);
+    if (connectedComponents) {
+      connectedComponents.add(host);
+    }
+    else {
+      InternalTranslationController.connectedComponents.set(host.tagName, new Set([host]));
+    }
+  }
+  /**
+   * Unregister a component from the `connectedComponents` map.
+   *
+   * @param {HTMLStencilElement} host - The component instance to unregister.
+   */
+  unRegisterComponent(host) {
+    const connectedComponents = InternalTranslationController.connectedComponents.get(host.tagName);
+    if (connectedComponents) {
+      connectedComponents.delete(host);
+    }
+  }
+  /**
+   * Retrieves the map of connected components, where each entry associates a tag name with a set of components.
+   *
+   * @returns {Map<string, Set<HTMLElement>>} A map of connected components.
+   */
+  getConnectedComponents() {
+    return InternalTranslationController.connectedComponents;
+  }
+}
+InternalTranslationController.connectedComponents = new Map();
+export const VegaInternalTranslation = new InternalTranslationController();

package/dist/collection/helpers/translation/locales/en.js

@@ -0,0 +1,74 @@
+/* eslint-disable @typescript-eslint/naming-convention */
+export const staticTranslations = {
+  // Form validation rule
+  'This field is required': 'This field is required',
+  'The minimum input value is {0}': 'The minimum input value is {0}',
+  'The maximum input value is {0}': 'The maximum input value is {0}',
+  'The end value should be greater than the start value': 'The end value should be greater than the start value',
+  'The end date should be later than start date': 'The end date should be later than start date',
+  'Credit card number is invalid': 'Credit card number is invalid',
+  'Please enter the correct email format.': 'Please enter the correct email format.',
+  'The maximum input length is {0}': 'The maximum input length is {0}',
+  'The start date should be later than {0}': 'The start date should be later than {0}',
+  'The start date should be earlier than {0}': 'The start date should be earlier than {0}',
+  'The end date should be earlier than {0}': 'The end date should be earlier than {0}',
+  'The date should be later than {0}': 'The date should be later than {0}',
+  'The date should be earlier than {0}': 'The date should be earlier than {0}',
+  'The minimum input length is {0}': 'The minimum input length is {0}',
+  'The end time should be later than start time': 'The end time should be later than start time',
+  'Phone number is not valid': 'Phone number is not valid',
+  'Phone number is valid but it belongs to country {0}, not country {1}': 'Phone number is valid but it belongs to country {0}, not country {1}',
+  // Component internal text
+  'Viewing': 'Viewing',
+  'Show': 'Show',
+  'Go To': 'Go To',
+  'Viewing {0}-{1} of {2}': 'Viewing {0}-{1} of {2}',
+  'Upload': 'Upload',
+  'Clear': 'Clear',
+  'Today': 'Today',
+  'Day': 'Day',
+  'Week': 'Week',
+  'Month': 'Month',
+  'Sun': 'Sun',
+  'Mon': 'Mon',
+  'Tue': 'Tue',
+  'Wed': 'Wed',
+  'Thu': 'Thu',
+  'Fri': 'Fri',
+  'Sat': 'Sat',
+  'Sun-short': 'S',
+  'Mon-short': 'M',
+  'Tue-short': 'T',
+  'Wed-short': 'W',
+  'Thu-short': 'T',
+  'Fri-short': 'F',
+  'Sat-short': 'S',
+  'January': 'January',
+  'February': 'February',
+  'March': 'March',
+  'April': 'April',
+  'May': 'May',
+  'June': 'June',
+  'July': 'July',
+  'August': 'August',
+  'September': 'September',
+  'October': 'October',
+  'November': 'November',
+  'December': 'December',
+  'All Day': 'All Day',
+  'Select or drop your file here': 'Select or drop your file here',
+  'Please sign here': 'Please sign here',
+  'Clear Signature': 'Clear Signature',
+  'Start Date': 'Start Date',
+  'End Date': 'End Date',
+  'Please select': 'Please select',
+  'No options': 'No options',
+  'No results found': 'No results found',
+  'Minimum': 'Minimum',
+  'Maximum': 'Maximum',
+  'Select Time': 'Select Time',
+  'Start Time': 'Start Time',
+  'End Time': 'End Time',
+  'There is no data to display': 'There is no data to display',
+};
+export default staticTranslations;

package/dist/collection/helpers/translation/tests/internal-translation-controller.test.js

@@ -0,0 +1,182 @@
+import en from '../locales/en';
+import ChangeManager from '../../change-manager/change-manager';
+import { UPDATE_TRANSLATION } from '../../change-manager/subject/static-subject/static-subject-title';
+import { LogUtility } from '../../../utils/log';
+import { VegaInternalTranslation } from '../internal-translation-controller';
+describe('VegaTranslationController', () => {
+  beforeEach(() => {
+    VegaInternalTranslation.init({ resources: { en }, language: 'en' });
+  });
+  it('should initialize with the default language as "en"', () => {
+    expect(VegaInternalTranslation.t('This field is required')).toBe('This field is required');
+  });
+  it('should initialize with default resources when no resources are provided', () => {
+    VegaInternalTranslation.init({ resources: undefined, language: 'en' });
+    expect(VegaInternalTranslation.t('This field is required')).toBe('This field is required');
+  });
+  it('should fallback to default language if resources are empty during initialization', () => {
+    spyOn(LogUtility, 'warn');
+    VegaInternalTranslation.init({ resources: {}, language: 'en' });
+    expect(VegaInternalTranslation.t('Viewing {0}-{1} of {2}', 1, 10, 100)).toBe('Viewing 1-10 of 100');
+    expect(LogUtility.warn).toHaveBeenCalledWith('Resources are empty. Falling back to default language "en".');
+  });
+  it('should set the current language correctly', () => {
+    const resources = {
+      en: en,
+      fr: {
+        // eslint-disable-next-line @typescript-eslint/naming-convention,spellcheck/spell-checker
+        'This field is required': 'Ce champ est obligatoire',
+      },
+    };
+    VegaInternalTranslation.init({ resources, language: 'fr' });
+    // eslint-disable-next-line spellcheck/spell-checker
+    expect(VegaInternalTranslation.t('This field is required')).toBe('Ce champ est obligatoire');
+  });
+  it('should fall back to default language if invalid language is provided', () => {
+    const resources = {
+      en: en,
+    };
+    VegaInternalTranslation.init({ resources, language: 'invalid_language' });
+    expect(VegaInternalTranslation.t('This field is required')).toBe('This field is required');
+  });
+  it('should change the current language if valid', () => {
+    spyOn(ChangeManager, 'notify');
+    const fr = {
+      // eslint-disable-next-line spellcheck/spell-checker,@typescript-eslint/naming-convention
+      'This field is required': 'Ce champ est obligatoire',
+      // eslint-disable-next-line spellcheck/spell-checker,@typescript-eslint/naming-convention
+      'The minimum input value is {0}': "La valeur d'entrée minimale est {0}",
+    };
+    VegaInternalTranslation.init({ resources: { en, fr }, language: 'en' });
+    VegaInternalTranslation.changeLanguage('fr');
+    // eslint-disable-next-line spellcheck/spell-checker
+    expect(VegaInternalTranslation.t('This field is required')).toBe('Ce champ est obligatoire');
+    expect(ChangeManager.notify).toHaveBeenCalledWith(UPDATE_TRANSLATION, {});
+  });
+  it('should log a warning if the language does not exist', () => {
+    spyOn(LogUtility, 'warn');
+    VegaInternalTranslation.changeLanguage('es');
+    expect(LogUtility.warn).toHaveBeenCalledWith('Language "es" not found in resources.');
+  });
+  it('should return the key if the translation is not found', () => {
+    expect(VegaInternalTranslation.t('Non existent key')).toBe('Non existent key');
+  });
+  it('should interpolate arguments into the translation string', () => {
+    expect(VegaInternalTranslation.t('The minimum input value is {0}', 5)).toBe('The minimum input value is 5');
+  });
+  it('should handle multiple arguments in the translation string', () => {
+    const enWithMultipleArgs = {
+      // eslint-disable-next-line @typescript-eslint/naming-convention
+      'Viewing {0}-{1} of {2}': 'Viewing {0}-{1} of {2}',
+    };
+    VegaInternalTranslation.init({ resources: { en: enWithMultipleArgs }, language: 'en' });
+    expect(VegaInternalTranslation.t('Viewing {0}-{1} of {2}', 1, 10, 100)).toBe('Viewing 1-10 of 100');
+  });
+  it('should return translated text as expect', () => {
+    const resources = {
+      /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+      en: Object.assign(Object.assign({}, en), { 'Custom text': 'Custom text' }),
+      fr: {
+        // eslint-disable-next-line @typescript-eslint/naming-convention,spellcheck/spell-checker
+        'This field is required': 'Ce champ est obligatoire',
+        'Custom text': 'Texte personnalisé',
+      },
+      /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    };
+    VegaInternalTranslation.init({ resources, language: 'fr' });
+    /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    expect(VegaInternalTranslation.t('This field is required')).toBe('Ce champ est obligatoire');
+    expect(VegaInternalTranslation.t('Custom text')).toBe('Texte personnalisé');
+    /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+  });
+  it('should return en resource as expected', () => {
+    /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    expect(en).toEqual({
+      'This field is required': 'This field is required',
+      'The minimum input value is {0}': 'The minimum input value is {0}',
+      'The maximum input value is {0}': 'The maximum input value is {0}',
+      'The end value should be greater than the start value': 'The end value should be greater than the start value',
+      'The end date should be later than start date': 'The end date should be later than start date',
+      'Credit card number is invalid': 'Credit card number is invalid',
+      'Please enter the correct email format.': 'Please enter the correct email format.',
+      'The maximum input length is {0}': 'The maximum input length is {0}',
+      'The start date should be later than {0}': 'The start date should be later than {0}',
+      'The start date should be earlier than {0}': 'The start date should be earlier than {0}',
+      'The end date should be earlier than {0}': 'The end date should be earlier than {0}',
+      'The date should be later than {0}': 'The date should be later than {0}',
+      'The date should be earlier than {0}': 'The date should be earlier than {0}',
+      'The minimum input length is {0}': 'The minimum input length is {0}',
+      'The end time should be later than start time': 'The end time should be later than start time',
+      'Phone number is not valid': 'Phone number is not valid',
+      'Phone number is valid but it belongs to country {0}, not country {1}': 'Phone number is valid but it belongs to country {0}, not country {1}',
+      'Viewing': 'Viewing',
+      'Show': 'Show',
+      'Go To': 'Go To',
+      'Viewing {0}-{1} of {2}': 'Viewing {0}-{1} of {2}',
+      'Upload': 'Upload',
+      'Clear': 'Clear',
+      'Today': 'Today',
+      'Day': 'Day',
+      'Week': 'Week',
+      'Month': 'Month',
+      'Sun': 'Sun',
+      'Mon': 'Mon',
+      'Tue': 'Tue',
+      'Wed': 'Wed',
+      'Thu': 'Thu',
+      'Fri': 'Fri',
+      'Sat': 'Sat',
+      'Sun-short': 'S',
+      'Mon-short': 'M',
+      'Tue-short': 'T',
+      'Wed-short': 'W',
+      'Thu-short': 'T',
+      'Fri-short': 'F',
+      'Sat-short': 'S',
+      'January': 'January',
+      'February': 'February',
+      'March': 'March',
+      'April': 'April',
+      'May': 'May',
+      'June': 'June',
+      'July': 'July',
+      'August': 'August',
+      'September': 'September',
+      'October': 'October',
+      'November': 'November',
+      'December': 'December',
+      'All Day': 'All Day',
+      'Select or drop your file here': 'Select or drop your file here',
+      'Please sign here': 'Please sign here',
+      'Clear Signature': 'Clear Signature',
+      'Start Date': 'Start Date',
+      'End Date': 'End Date',
+      'Please select': 'Please select',
+      'No options': 'No options',
+      'No results found': 'No results found',
+      'Minimum': 'Minimum',
+      'Maximum': 'Maximum',
+      'Select Time': 'Select Time',
+      'Start Time': 'Start Time',
+      'End Time': 'End Time',
+      'There is no data to display': 'There is no data to display',
+    });
+    /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+  });
+  it('should return default resource(en) translated text if the key not exist in custom resource', () => {
+    const resources = {
+      /* eslint-disable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+      en: en,
+      fr: {
+        // eslint-disable-next-line @typescript-eslint/naming-convention,spellcheck/spell-checker
+        'This field is required': 'Ce champ est obligatoire',
+        'Custom text': 'Texte personnalisé',
+      },
+      /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
+    };
+    VegaInternalTranslation.init({ resources, language: 'fr' });
+    // eslint-disable-next-line spellcheck/spell-checker
+    expect(VegaInternalTranslation.t('Custom text')).toBe('Texte personnalisé');
+    expect(VegaInternalTranslation.t('Sun-short')).toBe('S');
+  });
+});

package/dist/collection/helpers/translation/tests/translation.test.js

@@ -0,0 +1,32 @@
+import { VegaTranslation } from '../translation';
+import { VegaInternalTranslation } from '../internal-translation-controller';
+import { VegaTranslationResourceEN } from '../../public-api';
+describe('VegaTranslation', () => {
+  it('should translate to expected message', () => {
+    const resources = {
+      en: VegaTranslationResourceEN,
+      fr: {
+        // eslint-disable-next-line @typescript-eslint/naming-convention,spellcheck/spell-checker
+        'This field is required': 'Ce champ est obligatoire',
+      },
+    };
+    VegaTranslation.init({ resources, language: 'fr' });
+    // eslint-disable-next-line spellcheck/spell-checker
+    expect(VegaInternalTranslation.t('This field is required')).toBe('Ce champ est obligatoire');
+    VegaTranslation.changeLanguage('en');
+    expect(VegaInternalTranslation.t('This field is required')).toBe('This field is required');
+  });
+  it('should return current language when get currentLanguage', () => {
+    const resources = {
+      en: VegaTranslationResourceEN,
+      fr: {
+        // eslint-disable-next-line @typescript-eslint/naming-convention,spellcheck/spell-checker
+        'This field is required': 'Ce champ est obligatoire',
+      },
+    };
+    VegaTranslation.init({ resources, language: 'fr' });
+    expect(VegaTranslation.currentLanguage).toBe('fr');
+    VegaTranslation.changeLanguage('en');
+    expect(VegaTranslation.currentLanguage).toBe('en');
+  });
+});

package/dist/collection/helpers/translation/translation.js

@@ -0,0 +1,51 @@
+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 { VegaInternalTranslation } from './internal-translation-controller';
+import { InjectVegaTelemetrySlimmer } from 'vega-slimmer/core';
+import { createPublicAPIRuntimeMetricsSlimmer } from '../slimmers/runtime-metrics/create-public-api-runtime-metrics-slimmer';
+import { VegaTranslationRuntimeMetricsPayloadDefinition } from '../../constants/runtime-metrics-payload-definition/public-api/VegaTranslation/runtime-metrics-payload-definition';
+/**
+ * Vega Translation Public API
+ *
+ * @vegaVersion 2.27.0
+ */
+class TranslationController {
+  constructor() {
+    this.vegaPublicAPIRuntimeMetricsSlimmer = createPublicAPIRuntimeMetricsSlimmer(TranslationController, ['init', 'changeLanguage'], VegaTranslationRuntimeMetricsPayloadDefinition);
+  }
+  /**
+   * Get current language
+   *
+   * @returns {string} current language
+   * @vegaVersion 2.27.0
+   */
+  get currentLanguage() {
+    return VegaInternalTranslation.currentLanguage;
+  }
+  /**
+   * Initializes the translation controller with provided resources and language.
+   *
+   * @param {VegaTranslationConfig} config - Configuration object containing resources and initial language.
+   * @vegaVersion 2.27.0
+   */
+  init(config) {
+    VegaInternalTranslation.init(config);
+  }
+  /**
+   * Changes the current language if it exists in the resources.
+   *
+   * @param {string} language - The language code to change to.
+   * @vegaVersion 2.27.0
+   */
+  changeLanguage(language) {
+    VegaInternalTranslation.changeLanguage(language);
+  }
+}
+__decorate([
+  InjectVegaTelemetrySlimmer()
+], TranslationController.prototype, "vegaPublicAPIRuntimeMetricsSlimmer", void 0);
+export const VegaTranslation = new TranslationController();