feat: add ar, fi, nb, ta, vi locales to dynamic checkout

package.json

@@ -1,6 +1,6 @@
 {
   "name": "processout.js",
-  "version": "1.9.5",
+  "version": "1.9.6",
   "description": "ProcessOut.js is a JavaScript library for ProcessOut's payment processing API.",
   "scripts": {
     "build:processout": "tsc -p src/processout && uglifyjs --compress --keep-fnames --ie8 dist/processout.js -o dist/processout.js",

src/dynamic-checkout/dynamic-checkout.ts

@@ -162,6 +162,10 @@ module ProcessOut {
       this.widgetWrapper = document.createElement("div")
       this.widgetWrapper.setAttribute("class", "dynamic-checkout-widget-wrapper")
 
+      if (this.paymentConfig.locale === "ar") {
+        this.widgetWrapper.setAttribute("dir", "rtl")
+      }
+
       this.widgetWrapper.appendChild(view)
       this.dcoContainer.appendChild(this.widgetWrapper)
     }

src/dynamic-checkout/locales/ar.ts

@@ -0,0 +1,47 @@
+module ProcessOut {
+  export const ar = {
+    "apm-redirect-message": "سيتم تحويلك لإتمام عملية الدفع.",
+    "save-for-future-label": "حفظ لعمليات الدفع المستقبلية",
+    "continue-with-apm-button": "المتابعة باستخدام",
+    "pay-button-text": "ادفع",
+    "card-details-section-title": "تفاصيل البطاقة",
+    "cardholder-name-label": "اسم حامل البطاقة",
+    "billing-address-section-title": "عنوان الفوترة",
+    "country-label": "الدولة",
+    "select-country-placeholder": "اختر الدولة",
+    "select-state-placeholder": "اختر المنطقة",
+    "card-number-error-message": "رقم البطاقة غير صالح",
+    "expiry-date-error-message": "تاريخ الانتهاء غير صالح",
+    "cvc-error-message": "رمز الأمان غير صالح",
+    "cardholder-name-error-message": "اسم حامل البطاقة غير صالح",
+    "payment-error-message": "حدث خطأ ما. يرجى المحاولة مرة أخرى.",
+    "payment-cancelled-message": "تم إلغاء عملية الدفع.",
+    "express-checkout-header": "الدفع السريع",
+    "other-payment-methods-header": "طرق دفع أخرى",
+    "select-payment-method-label": "اختر طريقة الدفع",
+    "payment-success-message": "اكتملت عملية الدفع هذه.",
+    "payment-info-message": "نقوم بمعالجة عملية الدفع الخاصة بك. يمكنك الآن إغلاق هذه النافذة.",
+    "payment-pending-message": "عملية الدفع الخاصة بك قيد الانتظار.",
+    "payment-error-generic-message": "لم نتمكن من معالجة عملية الدفع الخاصة بك.",
+    "street1-label": "العنوان السطر 1",
+    "street2-label": "العنوان السطر 2",
+    "city-label": "المدينة",
+    "postcode-label": "الرمز البريدي",
+    "state-label": "المنطقة",
+    "payments-manager-header": "إدارة طرق الدفع المحفوظة",
+    "payments-manager-close-button": "إغلاق",
+    "no-saved-payment-methods-header": "لا توجد طرق دفع محفوظة",
+    "no-saved-payment-methods-message": "في المرة القادمة التي تحفظ فيها طريقة دفع، ستظهر هنا.",
+    "card-number-label": "رقم البطاقة",
+    "expiry-date-label": "تاريخ الانتهاء",
+    "cvc-label": "رمز الأمان",
+    "cvc-placeholder": "CVC/CVV",
+    "card-not-supported-error-message": "هذه البطاقة غير مدعومة",
+    "card-label": "بطاقة",
+    "delete-payment-method-label": "حذف طريقة الدفع",
+    "settings-button-label": "إدارة طرق الدفع المحفوظة",
+    "loading-label": "جارٍ التحميل",
+    "processing-payment-label": "جارٍ معالجة الدفع",
+    "card-form-label": "نموذج الدفع بالبطاقة",
+  }
+}

src/dynamic-checkout/locales/fi.ts

@@ -0,0 +1,48 @@
+module ProcessOut {
+  export const fi = {
+    "apm-redirect-message": "Sinut ohjataan viimeistelemään maksu.",
+    "save-for-future-label": "Tallenna tulevia maksuja varten",
+    "continue-with-apm-button": "Jatka tavalla",
+    "pay-button-text": "Maksa",
+    "card-details-section-title": "Kortin tiedot",
+    "cardholder-name-label": "Kortinhaltijan nimi",
+    "billing-address-section-title": "Laskutusosoite",
+    "country-label": "Maa",
+    "select-country-placeholder": "Valitse maa",
+    "select-state-placeholder": "Valitse osavaltio tai alue",
+    "card-number-error-message": "Kortin numero on virheellinen",
+    "expiry-date-error-message": "Viimeinen voimassaolopäivä on virheellinen",
+    "cvc-error-message": "Turvakoodi on virheellinen",
+    "cardholder-name-error-message": "Kortinhaltijan nimi on virheellinen",
+    "payment-error-message": "Jokin meni vikaan. Yritä uudelleen.",
+    "payment-cancelled-message": "Maksu on peruutettu.",
+    "express-checkout-header": "Pikamaksu",
+    "other-payment-methods-header": "Muut maksutavat",
+    "select-payment-method-label": "Valitse maksutapa",
+    "payment-success-message": "Tämä maksu on suoritettu.",
+    "payment-info-message": "Käsittelemme maksuasi. Voit nyt sulkea tämän ikkunan.",
+    "payment-pending-message": "Maksusi on käsittelyssä.",
+    "payment-error-generic-message": "Maksuasi ei voitu käsitellä.",
+    "street1-label": "Osoiterivi 1",
+    "street2-label": "Osoiterivi 2",
+    "city-label": "Kaupunki",
+    "postcode-label": "Postinumero",
+    "state-label": "Osavaltio tai alue",
+    "payments-manager-header": "Hallitse tallennettuja maksutapoja",
+    "payments-manager-close-button": "Sulje",
+    "no-saved-payment-methods-header": "Ei tallennettuja maksutapoja",
+    "no-saved-payment-methods-message":
+      "Kun seuraavan kerran tallennat maksutavan, se näkyy täällä.",
+    "card-number-label": "Kortin numero",
+    "expiry-date-label": "Viimeinen voimassaolopäivä",
+    "cvc-label": "Turvakoodi",
+    "cvc-placeholder": "CVC/CVV",
+    "card-not-supported-error-message": "Tätä korttia ei tueta",
+    "card-label": "Kortti",
+    "delete-payment-method-label": "Poista maksutapa",
+    "settings-button-label": "Hallitse tallennettuja maksutapoja",
+    "loading-label": "Ladataan",
+    "processing-payment-label": "Käsitellään maksua",
+    "card-form-label": "Kortin maksulomake",
+  }
+}

src/dynamic-checkout/locales/nb.ts

@@ -0,0 +1,47 @@
+module ProcessOut {
+  export const nb = {
+    "apm-redirect-message": "Du blir videresendt for å fullføre betalingen.",
+    "save-for-future-label": "Lagre for fremtidige betalinger",
+    "continue-with-apm-button": "Fortsett med",
+    "pay-button-text": "Betal",
+    "card-details-section-title": "Kortdetaljer",
+    "cardholder-name-label": "Kortholders navn",
+    "billing-address-section-title": "Faktureringsadresse",
+    "country-label": "Land",
+    "select-country-placeholder": "Velg land",
+    "select-state-placeholder": "Velg region",
+    "card-number-error-message": "Kortnummeret er ugyldig",
+    "expiry-date-error-message": "Utløpsdatoen er ugyldig",
+    "cvc-error-message": "Sikkerhetskoden er ugyldig",
+    "cardholder-name-error-message": "Kortholders navn er ugyldig",
+    "payment-error-message": "Noe gikk galt. Vennligst prøv igjen.",
+    "payment-cancelled-message": "Betalingen er kansellert.",
+    "express-checkout-header": "Ekspressutsjekk",
+    "other-payment-methods-header": "Andre betalingsmåter",
+    "select-payment-method-label": "Velg betalingsmåte",
+    "payment-success-message": "Denne betalingen er fullført.",
+    "payment-info-message": "Vi behandler betalingen din. Du kan nå lukke dette vinduet.",
+    "payment-pending-message": "Betalingen din er under behandling.",
+    "payment-error-generic-message": "Vi kunne ikke behandle betalingen din.",
+    "street1-label": "Adresselinje 1",
+    "street2-label": "Adresselinje 2",
+    "city-label": "By",
+    "postcode-label": "Postnummer",
+    "state-label": "Region",
+    "payments-manager-header": "Administrer lagrede betalingsmåter",
+    "payments-manager-close-button": "Lukk",
+    "no-saved-payment-methods-header": "Ingen lagrede betalingsmåter",
+    "no-saved-payment-methods-message": "Neste gang du lagrer en betalingsmåte, vil den vises her.",
+    "card-number-label": "Kortnummer",
+    "expiry-date-label": "Utløpsdato",
+    "cvc-label": "Sikkerhetskode",
+    "cvc-placeholder": "CVC/CVV",
+    "card-not-supported-error-message": "Dette kortet støttes ikke",
+    "card-label": "Kort",
+    "delete-payment-method-label": "Slett betalingsmåte",
+    "settings-button-label": "Administrer lagrede betalingsmåter",
+    "loading-label": "Laster",
+    "processing-payment-label": "Behandler betaling",
+    "card-form-label": "Skjema for kortbetaling",
+  }
+}

src/dynamic-checkout/locales/ta.ts

@@ -0,0 +1,48 @@
+module ProcessOut {
+  export const ta = {
+    "apm-redirect-message": "கட்டணத்தை முடிக்க நீங்கள் திருப்பி அனுப்பப்படுவீர்கள்.",
+    "save-for-future-label": "எதிர்கால கட்டணங்களுக்காகச் சேமிக்கவும்",
+    "continue-with-apm-button": "இதனுடன் தொடரவும்",
+    "pay-button-text": "செலுத்து",
+    "card-details-section-title": "அட்டை விவரங்கள்",
+    "cardholder-name-label": "அட்டைதாரரின் பெயர்",
+    "billing-address-section-title": "பில்லிங் முகவரி",
+    "country-label": "நாடு",
+    "select-country-placeholder": "நாட்டைத் தேர்ந்தெடுக்கவும்",
+    "select-state-placeholder": "மாநிலத்தைத் தேர்ந்தெடுக்கவும்",
+    "card-number-error-message": "அட்டை எண் தவறானது",
+    "expiry-date-error-message": "காலாவதி தேதி தவறானது",
+    "cvc-error-message": "பாதுகாப்புக் குறியீடு தவறானது",
+    "cardholder-name-error-message": "அட்டைதாரரின் பெயர் தவறானது",
+    "payment-error-message": "ஏதோ தவறு ஏற்பட்டது. மீண்டும் முயற்சிக்கவும்.",
+    "payment-cancelled-message": "கட்டணம் ரத்து செய்யப்பட்டது.",
+    "express-checkout-header": "விரைவு செக்அவுட்",
+    "other-payment-methods-header": "பிற கட்டண முறைகள்",
+    "select-payment-method-label": "கட்டண முறையைத் தேர்ந்தெடுக்கவும்",
+    "payment-success-message": "இந்தக் கட்டணம் முடிந்தது.",
+    "payment-info-message": "உங்கள் கட்டணத்தைச் செயலாக்குகிறோம். இப்போது இந்தச் சாளரத்தை மூடலாம்.",
+    "payment-pending-message": "உங்கள் கட்டணம் நிலுவையில் உள்ளது.",
+    "payment-error-generic-message": "உங்கள் கட்டணத்தைச் செயலாக்க முடியவில்லை.",
+    "street1-label": "முகவரி வரி 1",
+    "street2-label": "முகவரி வரி 2",
+    "city-label": "நகரம்",
+    "postcode-label": "அஞ்சல் குறியீடு",
+    "state-label": "மாநிலம்",
+    "payments-manager-header": "சேமித்த கட்டண முறைகளை நிர்வகிக்கவும்",
+    "payments-manager-close-button": "மூடு",
+    "no-saved-payment-methods-header": "சேமித்த கட்டண முறைகள் இல்லை",
+    "no-saved-payment-methods-message":
+      "அடுத்த முறை நீங்கள் ஒரு கட்டண முறையைச் சேமிக்கும்போது, அது இங்கே தோன்றும்.",
+    "card-number-label": "அட்டை எண்",
+    "expiry-date-label": "காலாவதி தேதி",
+    "cvc-label": "பாதுகாப்புக் குறியீடு",
+    "cvc-placeholder": "CVC/CVV",
+    "card-not-supported-error-message": "இந்த அட்டை ஆதரிக்கப்படவில்லை",
+    "card-label": "அட்டை",
+    "delete-payment-method-label": "கட்டண முறையை நீக்கு",
+    "settings-button-label": "சேமித்த கட்டண முறைகளை நிர்வகிக்கவும்",
+    "loading-label": "ஏற்றுகிறது",
+    "processing-payment-label": "கட்டணம் செயலாக்கப்படுகிறது",
+    "card-form-label": "அட்டை கட்டணப் படிவம்",
+  }
+}

src/dynamic-checkout/locales/vi.ts

@@ -0,0 +1,49 @@
+module ProcessOut {
+  export const vi = {
+    "apm-redirect-message": "Bạn sẽ được chuyển hướng để hoàn tất thanh toán.",
+    "save-for-future-label": "Lưu cho các lần thanh toán sau",
+    "continue-with-apm-button": "Tiếp tục với",
+    "pay-button-text": "Thanh toán",
+    "card-details-section-title": "Chi tiết thẻ",
+    "cardholder-name-label": "Tên chủ thẻ",
+    "billing-address-section-title": "Địa chỉ thanh toán",
+    "country-label": "Quốc gia",
+    "select-country-placeholder": "Chọn quốc gia",
+    "select-state-placeholder": "Chọn tỉnh hoặc bang",
+    "card-number-error-message": "Số thẻ không hợp lệ",
+    "expiry-date-error-message": "Ngày hết hạn không hợp lệ",
+    "cvc-error-message": "Mã bảo mật không hợp lệ",
+    "cardholder-name-error-message": "Tên chủ thẻ không hợp lệ",
+    "payment-error-message": "Đã xảy ra lỗi. Vui lòng thử lại.",
+    "payment-cancelled-message": "Thanh toán đã bị hủy.",
+    "express-checkout-header": "Thanh toán nhanh",
+    "other-payment-methods-header": "Phương thức thanh toán khác",
+    "select-payment-method-label": "Chọn phương thức thanh toán",
+    "payment-success-message": "Thanh toán này đã hoàn tất.",
+    "payment-info-message":
+      "Chúng tôi đang xử lý thanh toán của bạn. Bạn có thể đóng cửa sổ này ngay bây giờ.",
+    "payment-pending-message": "Thanh toán của bạn đang chờ xử lý.",
+    "payment-error-generic-message": "Chúng tôi không thể xử lý thanh toán của bạn.",
+    "street1-label": "Địa chỉ dòng 1",
+    "street2-label": "Địa chỉ dòng 2",
+    "city-label": "Thành phố",
+    "postcode-label": "Mã bưu chính",
+    "state-label": "Tỉnh hoặc bang",
+    "payments-manager-header": "Quản lý phương thức thanh toán đã lưu",
+    "payments-manager-close-button": "Đóng",
+    "no-saved-payment-methods-header": "Không có phương thức thanh toán đã lưu",
+    "no-saved-payment-methods-message":
+      "Lần tới khi bạn lưu một phương thức thanh toán, nó sẽ xuất hiện ở đây.",
+    "card-number-label": "Số thẻ",
+    "expiry-date-label": "Ngày hết hạn",
+    "cvc-label": "Mã bảo mật",
+    "cvc-placeholder": "CVC/CVV",
+    "card-not-supported-error-message": "Thẻ này không được hỗ trợ",
+    "card-label": "Thẻ",
+    "delete-payment-method-label": "Xóa phương thức thanh toán",
+    "settings-button-label": "Quản lý phương thức thanh toán đã lưu",
+    "loading-label": "Đang tải",
+    "processing-payment-label": "Đang xử lý thanh toán",
+    "card-form-label": "Biểu mẫu thanh toán bằng thẻ",
+  }
+}

src/dynamic-checkout/references.ts

@@ -24,15 +24,20 @@
 /// <reference path="config/assets.ts" />
 /// <reference path="config/billing-address.ts" />
 /// <reference path="types/api.ts" />
+/// <reference path="locales/ar.ts" />
 /// <reference path="locales/de.ts" />
 /// <reference path="locales/en.ts" />
 /// <reference path="locales/es.ts" />
+/// <reference path="locales/fi.ts" />
 /// <reference path="locales/fr.ts" />
 /// <reference path="locales/it.ts" />
 /// <reference path="locales/ja.ts" />
 /// <reference path="locales/ko.ts" />
+/// <reference path="locales/nb.ts" />
 /// <reference path="locales/pl.ts" />
 /// <reference path="locales/pt.ts" />
+/// <reference path="locales/ta.ts" />
+/// <reference path="locales/vi.ts" />
 /// <reference path="utils/events.ts" />
 /// <reference path="utils/translations.ts" />
 /// <reference path="utils/elements.ts" />

src/dynamic-checkout/styles/default.ts

@@ -929,4 +929,30 @@ const defaultStyles = `
       animation: none;
     }
   }
+
+  /* Right-to-left layout overrides (e.g. Arabic locale) */
+  .dynamic-checkout-widget-wrapper[dir="rtl"] .dco-payment-method-button-wrapper {
+    padding-right: 0;
+    padding-left: 10px;
+  }
+
+  .dynamic-checkout-widget-wrapper[dir="rtl"] .dco-payment-method-card-form-input-cvc {
+    padding-right: 0;
+    padding-left: 40px;
+  }
+
+  .dynamic-checkout-widget-wrapper[dir="rtl"] .dco-card-cvc-icon {
+    right: auto;
+    left: 10px;
+  }
+
+  .dynamic-checkout-widget-wrapper[dir="rtl"] .dco-card-scheme-logo {
+    right: auto;
+    left: 10px;
+  }
+
+  .dynamic-checkout-widget-wrapper[dir="rtl"] .dco-delete-payment-method-button {
+    margin-left: 0;
+    margin-right: auto;
+  }
 `

src/dynamic-checkout/utils/translations.ts

@@ -3,15 +3,20 @@
 module ProcessOut {
   export class Translations {
     static localeTranslationsMap = {
+      ar: ar,
       de: de,
       en: en,
       es: es,
+      fi: fi,
       fr: fr,
       it: it,
       ja: ja,
       ko: ko,
+      nb: nb,
       pl: pl,
       pt: pt,
+      ta: ta,
+      vi: vi,
     }
 
     static getText(key: string, locale: string) {