@spscommerce/i18n 4.8.0 → 4.10.1

package/lib/index.cjs.js

@@ -5567,10 +5567,38 @@ function () {
 Browser.type = 'languageDetector';
 
 function localize(_a) {
-    var detectorConfig = _a.detectorConfig, translationPath = _a.translationPath, i18nConfig = __rest(_a, ["detectorConfig", "translationPath"]);
+    var detectorConfig = _a.detectorConfig, translationPath = _a.translationPath, customDetectors = _a.customDetectors, i18nConfig = __rest(_a, ["detectorConfig", "translationPath", "customDetectors"]);
+    var languageDetector = new Browser();
+    // The default querystring detector does not support hash routing
+    var hashRouterQuerystringDetector = {
+        name: 'hashRouterQuerystringDetector',
+        lookup: function (options) {
+            try {
+                var lookupQuerystring = (options && options.lookupQuerystring) || 'lang';
+                var regex = new RegExp("[?&]" + lookupQuerystring + "(=([^&#]*)|&|#|$)");
+                var results = regex.exec(window.location.href);
+                if (results && results[2]) {
+                    var lang = decodeURIComponent(results[2].replace(/\+/g, ' '));
+                    if (lang) {
+                        return lang;
+                    }
+                }
+            }
+            catch (err) {
+                console.error(err);
+            }
+            return undefined;
+        },
+    };
+    languageDetector.addDetector(hashRouterQuerystringDetector);
+    if (Array.isArray(customDetectors)) {
+        customDetectors.forEach(function (customDetector) {
+            languageDetector.addDetector(customDetector);
+        });
+    }
     var detectionObject = detectorConfig || {
         // order and from where user language should be detected
-        order: ['querystring', 'cookie', 'localStorage'],
+        order: ['querystring', 'hashRouterQuerystringDetector', 'cookie', 'localStorage'],
         // keys or params to lookup language from
         lookupQuerystring: 'lang',
         lookupCookie: 'lang',
@@ -5591,8 +5619,9 @@ function localize(_a) {
         }, interpolation: {
             escapeValue: false, // React takes care of interpolation for us
         }, detection: detectionObject }, i18nConfig);
-    i18next.use(Backend) // used for loading external translation files
-        .use(Browser) // used to detect langage via cookie, local storage, or query param
+    return i18next
+        .use(Backend) // used for loading external translation files
+        .use(languageDetector) // used to detect langage via cookie, local storage, or query param
         .use(initReactI18next) // implement React-specefic libs to handle i18next chores
         .init(mergedConfig);
 }

package/lib/index.esm.js

@@ -5534,10 +5534,38 @@ function () {
 Browser.type = 'languageDetector';
 
 function localize(_a) {
-    var detectorConfig = _a.detectorConfig, translationPath = _a.translationPath, i18nConfig = __rest(_a, ["detectorConfig", "translationPath"]);
+    var detectorConfig = _a.detectorConfig, translationPath = _a.translationPath, customDetectors = _a.customDetectors, i18nConfig = __rest(_a, ["detectorConfig", "translationPath", "customDetectors"]);
+    var languageDetector = new Browser();
+    // The default querystring detector does not support hash routing
+    var hashRouterQuerystringDetector = {
+        name: 'hashRouterQuerystringDetector',
+        lookup: function (options) {
+            try {
+                var lookupQuerystring = (options && options.lookupQuerystring) || 'lang';
+                var regex = new RegExp("[?&]" + lookupQuerystring + "(=([^&#]*)|&|#|$)");
+                var results = regex.exec(window.location.href);
+                if (results && results[2]) {
+                    var lang = decodeURIComponent(results[2].replace(/\+/g, ' '));
+                    if (lang) {
+                        return lang;
+                    }
+                }
+            }
+            catch (err) {
+                console.error(err);
+            }
+            return undefined;
+        },
+    };
+    languageDetector.addDetector(hashRouterQuerystringDetector);
+    if (Array.isArray(customDetectors)) {
+        customDetectors.forEach(function (customDetector) {
+            languageDetector.addDetector(customDetector);
+        });
+    }
     var detectionObject = detectorConfig || {
         // order and from where user language should be detected
-        order: ['querystring', 'cookie', 'localStorage'],
+        order: ['querystring', 'hashRouterQuerystringDetector', 'cookie', 'localStorage'],
         // keys or params to lookup language from
         lookupQuerystring: 'lang',
         lookupCookie: 'lang',
@@ -5558,8 +5586,9 @@ function localize(_a) {
         }, interpolation: {
             escapeValue: false, // React takes care of interpolation for us
         }, detection: detectionObject }, i18nConfig);
-    i18next.use(Backend) // used for loading external translation files
-        .use(Browser) // used to detect langage via cookie, local storage, or query param
+    return i18next
+        .use(Backend) // used for loading external translation files
+        .use(languageDetector) // used to detect langage via cookie, local storage, or query param
         .use(initReactI18next) // implement React-specefic libs to handle i18next chores
         .init(mergedConfig);
 }

package/lib/localize.d.ts

@@ -11,6 +11,11 @@ export interface IDetectorOptions {
 }
 export interface ILocalizeOptions extends InitOptions {
     detectorConfig?: IDetectorOptions;
+    customDetectors?: {
+        name: string;
+        lookup: (options: IDetectorOptions) => string | undefined;
+        cacheUserLanguage?: (lang: string, options: IDetectorOptions) => void;
+    }[];
     translationPath?: string;
 }
-export declare function localize({ detectorConfig, translationPath, ...i18nConfig }: ILocalizeOptions): void;
+export declare function localize({ detectorConfig, translationPath, customDetectors, ...i18nConfig }: ILocalizeOptions): Promise<import("i18next").TFunction>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spscommerce/i18n",
   "description": "SPS Design System React components",
-  "version": "4.8.0",
+  "version": "4.10.1",
   "author": "SPS Commerce",
   "license": "UNLICENSED",
   "repository": "https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/i18n",