fix: optimize local-picker #276

source/i18n/map/languages.mjs

@@ -13,92 +13,92 @@
  */
 
 export const languages = {
-    "en": "English",
+	en: "English",
 	"en-GB": "English (United Kingdom)",
 	"en-US": "English (United States)",
 	"en-CA": "English (Canada)",
 	"en-AU": "English (Australia)",
-    "es": "Español",
+	es: "Español",
 	"es-ES": "Español (España)",
 	"es-MX": "Español (México)",
 	"es-AR": "Español (Argentina)",
-    "zh": "中文",
+	zh: "中文",
 	"zh-CN": "中文（简体）",
 	"zh-TW": "中文（繁體）",
 	"zh-HK": "中文（香港）",
-    "fr": "Français",
+	fr: "Français",
 	"fr-FR": "Français (France)",
 	"fr-CA": "Français (Canada)",
 	"fr-BE": "Français (Belgique)",
-    "de": "Deutsch",
+	de: "Deutsch",
 	"de-DE": "Deutsch (Deutschland)",
 	"de-AT": "Deutsch (Österreich)",
 	"de-CH": "Deutsch (Schweiz)",
-    "ja": "日本語",
-    "ru": "Русский",
+	ja: "日本語",
+	ru: "Русский",
 	"ru-RU": "Русский (Россия)",
-    "it": "Italiano",
+	it: "Italiano",
 	"it-IT": "Italiano (Italia)",
-    "pt": "Português",
+	pt: "Português",
 	"pt-PT": "Português (Portugal)",
 	"pt-BR": "Português (Brasil)",
-    "ko": "한국어",
-    "ar": "العربية",
-    "hi": "हिन्दी",
-    "bn": "বাংলা",
-    "pa": "ਪੰਜਾਬੀ",
-    "id": "Bahasa Indonesia",
-    "vi": "Tiếng Việt",
-    "tr": "Türkçe",
+	ko: "한국어",
+	ar: "العربية",
+	hi: "हिन्दी",
+	bn: "বাংলা",
+	pa: "ਪੰਜਾਬੀ",
+	id: "Bahasa Indonesia",
+	vi: "Tiếng Việt",
+	tr: "Türkçe",
 	"tr-TR": "Türkçe (Türkiye)",
-    "pl": "Polski",
+	pl: "Polski",
 	"pl-PL": "Polski (Polska)",
-    "uk": "Українська",
+	uk: "Українська",
 	"uk-UA": "Українська (Україна)",
-    "ro": "Română",
+	ro: "Română",
 	"ro-RO": "Română (România)",
-    "nl": "Nederlands",
+	nl: "Nederlands",
 	"nl-NL": "Nederlands (Nederland)",
-    "el": "Ελληνικά",
+	el: "Ελληνικά",
 	"el-GR": "Ελληνικά (Ελλάδα)",
-    "hu": "Magyar",
+	hu: "Magyar",
 	"hu-HU": "Magyar (Magyarország)",
-    "sv": "Svenska",
+	sv: "Svenska",
 	"sv-SE": "Svenska (Sverige)",
-    "cs": "Čeština",
+	cs: "Čeština",
 	"cs-CZ": "Čeština (Česká republika)",
-    "bg": "Български",
+	bg: "Български",
 	"bg-BG": "Български (България)",
-    "da": "Dansk",
+	da: "Dansk",
 	"da-DK": "Dansk (Danmark)",
-    "fi": "Suomi",
+	fi: "Suomi",
 	"fi-FI": "Suomi (Suomi)",
-    "sk": "Slovenčina",
+	sk: "Slovenčina",
 	"sk-SK": "Slovenčina (Slovensko)",
-    "he": "עברית",
-    "th": "ไทย",
-    "sr": "Српски",
+	he: "עברית",
+	th: "ไทย",
+	sr: "Српски",
 	"sr-RS": "Српски (Србија)",
-    "no": "Norsk",
+	no: "Norsk",
 	"no-NO": "Norsk (Norge)",
-    "lt": "Lietuvių",
+	lt: "Lietuvių",
 	"lt-LT": "Lietuvių (Lietuva)",
-    "lv": "Latviešu",
+	lv: "Latviešu",
 	"lv-LV": "Latviešu (Latvija)",
-    "et": "Eesti",
+	et: "Eesti",
 	"et-EE": "Eesti (Eesti)",
-    "hr": "Hrvatski",
+	hr: "Hrvatski",
 	"hr-HR": "Hrvatski (Hrvatska)",
-    "sl": "Slovenščina",
+	sl: "Slovenščina",
 	"sl-SI": "Slovenščina (Slovenija)",
-    "mt": "Malti",
+	mt: "Malti",
 	"mt-MT": "Malti (Malta)",
-    "is": "Íslenska",
+	is: "Íslenska",
 	"is-IS": "Íslenska (Ísland)",
-    "ga": "Gaeilge",
+	ga: "Gaeilge",
 	"ga-IE": "Gaeilge (Éire)",
-    "cy": "Cymraeg",
+	cy: "Cymraeg",
 	"cy-GB": "Cymraeg (Y Deyrnas Unedig)",
-    "sq": "Shqip",
-    "sq-AL": "Shqip (Shqipëria)"
+	sq: "Shqip",
+	"sq-AL": "Shqip (Shqipëria)",
 };

source/i18n/util.mjs

@@ -36,8 +36,9 @@ export function detectUserLanguagePreference() {
     }
 
     // add to preferredLanguages all the base languages of the preferred languages
-    preferredLanguages = preferredLanguages.concat(preferredLanguages.map(lang => lang.split("-")[0]));
-
+    preferredLanguages = preferredLanguages.concat(
+        preferredLanguages.map((lang) => lang.split("-")[0]),
+    );
 
     if (!currentLang && preferredLanguages.length === 0) {
         return {
@@ -56,11 +57,14 @@ export function detectUserLanguagePreference() {
     const availableLanguages = [...linkTags].map((link) => {
         const fullLang = link.hreflang;
         const baseLang = fullLang.split("-")[0];
-        let label = link.getAttribute('data-monster-label')
+        let label = link.getAttribute("data-monster-label");
+        if (!label) {
+            label = link.getAttribute("title");
             if (!label) {
-            label = languages?.[fullLang]
+                 label = languages?.[fullLang];
                 if (!label) {
-                label = languages?.[baseLang]
+                    label = languages?.[baseLang];
+                }
             }
         }
 
@@ -73,7 +77,11 @@ export function detectUserLanguagePreference() {
     });
 
     // filter availableLanguages to only include languages that are in the preferredLanguages array
-    const offerableLanguages = availableLanguages.filter(lang => preferredLanguages.includes(lang.fullLang) || preferredLanguages.includes(lang.baseLang));
+    const offerableLanguages = availableLanguages.filter(
+        (lang) =>
+            preferredLanguages.includes(lang.fullLang) ||
+            preferredLanguages.includes(lang.baseLang),
+    );
 
     if (offerableLanguages.length === 0) {
         return {
@@ -103,7 +111,7 @@ export function detectUserLanguagePreference() {
     const bestMatch = offerableLanguages[0];
     const bestMatchWeight = getWeight(bestMatch);
 
-    const currentLabel = languages?.[currentLang] || currentLang
+    const currentLabel = languages?.[currentLang] || currentLang;
 
     // If we found a language that matches user preferences (weight > 1)
     if (bestMatchWeight > 0) {

source/monster.mjs

@@ -91,6 +91,7 @@ export * from "./components/datatable/embedded-pagination.mjs";
 export * from "./components/datatable/status.mjs";
 export * from "./components/datatable/change-button.mjs";
 export * from "./components/datatable/constants.mjs";
+export * from "./components/accessibility/locale-picker.mjs";
 export * from "./components/state/log/entry.mjs";
 export * from "./components/state/state.mjs";
 export * from "./components/state/log.mjs";