langie 1.10.1 → 1.11.1

package/dist/components/index.cjs

@@ -1,5 +1,5 @@
 /**
- * langie v1.10.1
+ * langie v1.11.1
  * (c) 2026 nlit
  * @license Apache-2.0
  *
@@ -78,6 +78,7 @@ styleInject(".multiselect-single-label,\n.multiselect-option {\n  display: flex;
 var import_vue3 = require("vue");
 var import_multiselect = __toESM(require("@vueform/multiselect"));
 var import_fuse = __toESM(require("fuse.js"));
+var import_transliteration = require("transliteration");
 
 // src/language-aliases/european.ts
 var EUROPEAN_LANGUAGES = [
@@ -87,6 +88,8 @@ var EUROPEAN_LANGUAGES = [
     match: [
       "eng",
       "en",
+      "\u0430\u043D\u0433\u043B\u0438\u0439\u0441\u043A\u0438\u0439",
+      "\u0430\u043D\u0433\u043B",
       "united states",
       "united states of america",
       "usa",
@@ -100,6 +103,31 @@ var EUROPEAN_LANGUAGES = [
     ],
     suggest: ["irish", "scottish", "welsh"]
   },
+  // English variants: country name / abbreviation → the specific variant CODE.
+  // `lang` here is a variant code (not a language name) so Fuse matches it against
+  // the `code` key and ranks that exact variant first (e.g. "сша" → en-US #1).
+  // Latin "usa"/"us" stay on the `english` entry above (surface the whole group);
+  // these cover the Cyrillic exonyms the translated names never contain.
+  {
+    lang: "en-us",
+    match: ["\u0441\u0448\u0430", "\u0448\u0442\u0430\u0442\u044B", "\u0430\u043C\u0435\u0440\u0438\u043A\u0430", "\u0441\u043E\u0435\u0434\u0438\u043D\u0451\u043D\u043D\u044B\u0435 \u0448\u0442\u0430\u0442\u044B", "\u0441\u043E\u0435\u0434\u0438\u043D\u0435\u043D\u043D\u044B\u0435 \u0448\u0442\u0430\u0442\u044B"],
+    suggest: []
+  },
+  {
+    lang: "en-au",
+    match: ["\u0430\u0432\u0441\u0442\u0440\u0430\u043B\u0438\u044F"],
+    suggest: []
+  },
+  {
+    lang: "en-ca",
+    match: ["\u043A\u0430\u043D\u0430\u0434\u0430"],
+    suggest: []
+  },
+  {
+    lang: "en-ie",
+    match: ["\u0438\u0440\u043B\u0430\u043D\u0434\u0438\u044F"],
+    suggest: []
+  },
   {
     lang: "spanish",
     match: [
@@ -195,7 +223,19 @@ var EUROPEAN_LANGUAGES = [
   },
   {
     lang: "serbian",
-    match: ["srp", "sr", "ser", "serbia", "serbian", "srpski", "\u0441\u0440\u0431\u0438\u0458\u0430", "\u0441\u0440\u043F\u0441\u043A\u0438"],
+    match: [
+      "srp",
+      "sr",
+      "ser",
+      "serbia",
+      "serbian",
+      "srpski",
+      "\u0441\u0440\u0431\u0438\u0458\u0430",
+      "\u0441\u0440\u043F\u0441\u043A\u0438",
+      "\u0441\u0435\u0440\u0431",
+      "\u0441\u0435\u0440\u0431\u0441\u043A\u0438\u0439",
+      "\u0441\u0435\u0440\u0431\u0441"
+    ],
     suggest: ["croatian", "bosnian", "montenegrin"]
   },
   {
@@ -361,7 +401,7 @@ var ASIAN_LANGUAGES = [
   // Central Asian & Turkic Languages
   {
     lang: "kazakh",
-    match: ["kaz", "kk", "kazakh", "kazakhstan"],
+    match: ["kaz", "kk", "kazlat", "kazakh", "kazakhstan", "\u043A\u0430\u0437\u0430\u0445", "\u043A\u0430\u0437\u0430\u0445\u0441\u043A\u0438\u0439", "\u043A\u0430\u0437\u0430\u0445\u0441"],
     suggest: ["russian", "kyrgyz", "uzbek"]
   },
   {
@@ -627,11 +667,17 @@ var _hoisted_1 = {
 };
 var _hoisted_2 = ["src", "alt"];
 var _hoisted_3 = { class: "language-text" };
-var _hoisted_4 = { class: "native-name" };
+var _hoisted_4 = {
+  key: 0,
+  class: "native-name"
+};
 var _hoisted_5 = ["data-lang-code"];
 var _hoisted_6 = ["src", "alt"];
 var _hoisted_7 = { class: "language-text" };
-var _hoisted_8 = { class: "native-name" };
+var _hoisted_8 = {
+  key: 0,
+  class: "native-name"
+};
 var _hoisted_9 = { class: "multiselect-no-options" };
 var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
   __name: "LanguageSelect",
@@ -678,13 +724,13 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
       "5b09cc17-THEME_COLORS.dark.border": (0, import_vue2.unref)(THEME_COLORS).dark.border,
       "5b09cc17-THEME_COLORS.dark.placeholder": (0, import_vue2.unref)(THEME_COLORS).dark.placeholder,
       "5b09cc17-THEME_COLORS.dark.ring": (0, import_vue2.unref)(THEME_COLORS).dark.ring,
+      "5b09cc17-THEME_COLORS.dark.dropdownText": (0, import_vue2.unref)(THEME_COLORS).dark.dropdownText,
       "5b09cc17-THEME_COLORS.dark.optionPointed": (0, import_vue2.unref)(THEME_COLORS).dark.optionPointed,
       "5b09cc17-THEME_COLORS.dark.optionPointedText": (0, import_vue2.unref)(THEME_COLORS).dark.optionPointedText,
       "5b09cc17-THEME_COLORS.dark.optionSelected": (0, import_vue2.unref)(THEME_COLORS).dark.optionSelected,
       "5b09cc17-THEME_COLORS.dark.optionSelectedText": (0, import_vue2.unref)(THEME_COLORS).dark.optionSelectedText,
       "5b09cc17-THEME_COLORS.dark.dropdownBackground": (0, import_vue2.unref)(THEME_COLORS).dark.dropdownBackground,
       "5b09cc17-THEME_COLORS.dark.dropdownBorder": (0, import_vue2.unref)(THEME_COLORS).dark.dropdownBorder,
-      "5b09cc17-THEME_COLORS.dark.dropdownText": (0, import_vue2.unref)(THEME_COLORS).dark.dropdownText,
       "5b09cc17-COLORS.border.flag": (0, import_vue2.unref)(COLORS).border.flag,
       "5b09cc17-COLORS.border.dark": (0, import_vue2.unref)(COLORS).border.dark,
       "5b09cc17-COLORS.text.secondary": (0, import_vue2.unref)(COLORS).text.secondary,
@@ -700,6 +746,7 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
     };
     const props = __props;
     const emit = __emit;
+    const multiselectRef = (0, import_vue3.ref)(null);
     const isLoading = (0, import_vue3.computed)(() => {
       return props.languages.length <= 0;
     });
@@ -710,10 +757,12 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
     const fuse = (0, import_vue3.computed)(() => {
       if (!validLanguages.value.length) return null;
       return new import_fuse.default(validLanguages.value, {
-        keys: ["name", "native_name", "code"],
+        keys: ["name", "native_name", "search_alias", "code"],
         includeScore: true,
-        threshold: 0.6,
-        // Use highest threshold to catch all cases
+        threshold: 0.4,
+        // Trim fuzzy noise; short abbreviations (e.g. "сша") no longer rank below it
+        ignoreLocation: true,
+        // Match anywhere in the field, not just near position 0
         isCaseSensitive: false,
         minMatchCharLength: 1
         // Allow single character matches
@@ -745,15 +794,18 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
         if (!fuse.value) return [];
         const aliasResult = applyLanguageAlias(query);
         const searchTerm = Array.isArray(aliasResult.primary) ? aliasResult.primary[0] : aliasResult.primary;
-        const fuseResults = fuse.value.search(searchTerm);
-        results = fuseResults.map((result) => result.item);
-        if (searchTerm !== query) {
-          const originalResults = fuse.value.search(query);
-          originalResults.forEach((result) => {
-            if (!results.some((r) => r.code === result.item.code)) {
-              results.push(result.item);
-            }
+        const mergeByCode = (hits) => {
+          hits.forEach((hit) => {
+            if (!results.some((r) => r.code === hit.item.code)) results.push(hit.item);
           });
+        };
+        results = fuse.value.search(searchTerm).map((result) => result.item);
+        if (searchTerm !== query) {
+          mergeByCode(fuse.value.search(query));
+        }
+        const latinQuery = (0, import_transliteration.transliterate)(query);
+        if (latinQuery && latinQuery.toLowerCase() !== query.toLowerCase()) {
+          mergeByCode(fuse.value.search(latinQuery));
         }
         if (aliasResult.suggestions.length > 0) {
           aliasResult.suggestions.forEach((suggestion) => {
@@ -791,33 +843,26 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
     });
     function handleSearch(query) {
       searchQuery.value = query;
-      if (query.trim()) {
-        (0, import_vue3.nextTick)(() => {
-          const dropdown = document.querySelector(".multiselect-dropdown");
-          const firstOption = dropdown?.querySelector(".multiselect-option");
-          if (firstOption) {
-            firstOption.scrollIntoView({ behavior: "smooth", block: "nearest" });
-            firstOption.classList.add("multiselect-option-is-pointed");
-          }
-        });
-      }
+      if (!query.trim()) return;
+      (0, import_vue3.nextTick)(() => {
+        multiselectRef.value?.setPointerFirst?.();
+        const dropdown = document.querySelector(".multiselect-dropdown");
+        if (dropdown) dropdown.scrollTop = 0;
+      });
     }
     function handleKeydown(event) {
       const keyboardEvent = event;
-      if (keyboardEvent.key === "Tab" || keyboardEvent.key === "Enter") {
-        const dropdown = document.querySelector(".multiselect-dropdown");
-        const firstOption = dropdown?.querySelector(".multiselect-option");
-        if (firstOption && searchQuery.value.trim()) {
-          const langCode = firstOption.getAttribute("data-lang-code");
-          if (langCode) {
-            const language = validLanguages.value.find((lang) => lang.code === langCode);
-            if (language) {
-              selectedLanguage.value = language;
-              searchQuery.value = "";
-              keyboardEvent.preventDefault();
-            }
-          }
-        }
+      if (keyboardEvent.key !== "Tab" && keyboardEvent.key !== "Enter") return;
+      if (!searchQuery.value.trim()) return;
+      const dropdown = document.querySelector(".multiselect-dropdown");
+      const pointed = dropdown?.querySelector(".multiselect-option.is-pointed [data-lang-code]") || dropdown?.querySelector(".multiselect-option [data-lang-code]");
+      const langCode = pointed?.getAttribute("data-lang-code");
+      if (!langCode) return;
+      const language = validLanguages.value.find((lang) => lang.code === langCode);
+      if (language) {
+        selectedLanguage.value = language;
+        searchQuery.value = "";
+        keyboardEvent.preventDefault();
       }
     }
     const onFlagError = (event) => {
@@ -845,6 +890,8 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
         [
           (0, import_vue2.createCommentVNode)(" Show multiselect when we have languages OR when not loading "),
           validLanguages.value.length > 0 || !isLoading.value ? ((0, import_vue2.openBlock)(), (0, import_vue2.createBlock)((0, import_vue2.unref)(import_multiselect.default), {
+            ref_key: "multiselectRef",
+            ref: multiselectRef,
             key: multiselectKey.value,
             modelValue: selectedLanguage.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedLanguage.value = $event),
@@ -857,7 +904,7 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
             placeholder: validLanguages.value.length === 0 ? "No languages available" : __props.placeholder,
             disabled: props.disabled || validLanguages.value.length === 0,
             loading: isLoading.value,
-            "track-by": "name",
+            "track-by": "code",
             label: "name",
             "value-prop": "code",
             "filter-results": false,
@@ -878,13 +925,13 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
                     1
                     /* TEXT */
                   ),
-                  (0, import_vue2.createElementVNode)(
+                  value.native_name && value.native_name !== value.name ? ((0, import_vue2.openBlock)(), (0, import_vue2.createElementBlock)(
                     "span",
                     _hoisted_4,
-                    "(" + (0, import_vue2.toDisplayString)(value.native_name || value.name) + ")",
+                    "(" + (0, import_vue2.toDisplayString)(value.native_name) + ")",
                     1
                     /* TEXT */
-                  )
+                  )) : (0, import_vue2.createCommentVNode)("v-if", true)
                 ])
               ])) : (0, import_vue2.createCommentVNode)("v-if", true)
             ]),
@@ -906,13 +953,13 @@ var LanguageSelect_default = /* @__PURE__ */ (0, import_vue.defineComponent)({
                     1
                     /* TEXT */
                   ),
-                  (0, import_vue2.createElementVNode)(
+                  option.native_name && option.native_name !== option.name ? ((0, import_vue2.openBlock)(), (0, import_vue2.createElementBlock)(
                     "span",
                     _hoisted_8,
-                    "(" + (0, import_vue2.toDisplayString)(option.native_name || option.name) + ")",
+                    "(" + (0, import_vue2.toDisplayString)(option.native_name) + ")",
                     1
                     /* TEXT */
-                  )
+                  )) : (0, import_vue2.createCommentVNode)("v-if", true)
                 ])
               ], 8, _hoisted_5)
             ]),
@@ -1229,6 +1276,181 @@ var clearCache = (pattern) => {
   return cacheManager.clear(pattern);
 };
 
+// src/core.ts
+var DEFAULT_TRANSLATOR_HOST = "http://localhost:8081";
+var translationCache = /* @__PURE__ */ new Map();
+function getTranslationCacheKey(serviceTranslations, options) {
+  return JSON.stringify({
+    translations: serviceTranslations.map((t) => ({
+      [API_FIELD_TEXT]: t[API_FIELD_TEXT],
+      [API_FIELD_FROM]: t[API_FIELD_FROM],
+      [API_FIELD_TO]: t[API_FIELD_TO],
+      [API_FIELD_CTX]: t[API_FIELD_CTX] || options[API_FIELD_CTX] || "ui"
+    })),
+    host: options.translatorHost || DEFAULT_TRANSLATOR_HOST,
+    context: options[API_FIELD_CTX] || "ui"
+  });
+}
+async function translateBatch(translations2 = [], options = {}) {
+  if (!Array.isArray(translations2) || translations2.length === 0) {
+    throw new Error("translations must be a non-empty array");
+  }
+  const translatorHost = options.translatorHost || DEFAULT_TRANSLATOR_HOST;
+  const apiKey = options.apiKey || process.env.TRANSLATOR_API_KEY;
+  const serviceTranslations = [];
+  const indexMap = [];
+  translations2.forEach((tr, idx) => {
+    const from = (tr[API_FIELD_FROM] || "").toLowerCase();
+    const to = (tr[API_FIELD_TO] || "").toLowerCase();
+    if (from === to) {
+      return;
+    }
+    serviceTranslations.push(tr);
+    indexMap.push(idx);
+  });
+  let serviceResults = [];
+  if (serviceTranslations.length > 0) {
+    const cacheKey = getTranslationCacheKey(serviceTranslations, options);
+    if (translationCache.has(cacheKey)) {
+      serviceResults = await translationCache.get(cacheKey);
+    } else {
+      const translationPromise = (async () => {
+        try {
+          const turnstileToken = options.getTurnstileToken ? await options.getTurnstileToken() : void 0;
+          const controller = new AbortController();
+          const timeoutId = setTimeout(() => controller.abort(), 5e3);
+          const resp = await fetch(`${translatorHost}/translate`, {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json",
+              ...apiKey ? { Authorization: `Bearer ${apiKey}`, "X-Api-Key": apiKey } : {}
+            },
+            body: JSON.stringify({
+              [API_FIELD_TRANSLATIONS]: serviceTranslations.map((t) => ({
+                [API_FIELD_TEXT]: t[API_FIELD_TEXT],
+                [API_FIELD_FROM]: t[API_FIELD_FROM],
+                [API_FIELD_TO]: t[API_FIELD_TO],
+                [API_FIELD_CTX]: t[API_FIELD_CTX] || options[API_FIELD_CTX] || "ui"
+              })),
+              [API_FIELD_CTX]: options[API_FIELD_CTX] || "ui",
+              ...turnstileToken ? { [API_FIELD_TURNSTILE]: turnstileToken } : {}
+            }),
+            signal: controller.signal
+          });
+          clearTimeout(timeoutId);
+          if (!resp.ok) {
+            console.error(
+              "[translator-sdk] Translator error response:",
+              resp.status,
+              resp.statusText
+            );
+            throw new Error(`Translator service error: ${resp.status} ${resp.statusText}`);
+          }
+          let parsed;
+          try {
+            parsed = await resp.clone().json();
+          } catch (jsonErr) {
+            console.error("[translator-sdk] Failed to parse JSON response:", jsonErr);
+            throw new Error(`Failed to parse JSON response: ${jsonErr}`);
+          }
+          const data = parsed || {};
+          if (data[API_FIELD_ERROR]) {
+            console.warn(`[translator-sdk] Top-level API error:`, data[API_FIELD_ERROR]);
+            return serviceTranslations.map((translation) => ({
+              [API_FIELD_TEXT]: translation[API_FIELD_TEXT],
+              [API_FIELD_ERROR]: data[API_FIELD_ERROR]
+            }));
+          }
+          const results = Array.isArray(data[API_FIELD_TRANSLATIONS]) ? data[API_FIELD_TRANSLATIONS].map((translation, index) => {
+            const originalText = serviceTranslations[index]?.[API_FIELD_TEXT] || "";
+            if (translation[API_FIELD_ERROR]) {
+              console.warn(
+                `[translator-sdk] Translation error for "${originalText}":`,
+                translation[API_FIELD_ERROR]
+              );
+              return {
+                [API_FIELD_TEXT]: originalText,
+                // Return original text on error
+                [API_FIELD_ERROR]: translation[API_FIELD_ERROR]
+              };
+            }
+            if (translation[API_FIELD_FROM] && !translation[API_FIELD_TEXT]) {
+              return {
+                [API_FIELD_TEXT]: originalText,
+                // For detection, return original text
+                [API_FIELD_FROM]: translation[API_FIELD_FROM]
+              };
+            }
+            return {
+              [API_FIELD_TEXT]: translation[API_FIELD_TEXT] || originalText
+            };
+          }) : data[API_FIELD_TEXT] ? [{ [API_FIELD_TEXT]: data[API_FIELD_TEXT] }] : [];
+          return results;
+        } catch (error) {
+          translationCache.delete(cacheKey);
+          if (error instanceof Error && error.name === "AbortError") {
+            const message2 = `Translator request to ${translatorHost} timed out after 5 seconds.`;
+            console.error(message2);
+            throw new Error(message2);
+          }
+          const message = `Failed to connect to translator at ${translatorHost}. Is the service running?`;
+          console.error(message);
+          throw new Error(message);
+        }
+      })();
+      translationCache.set(cacheKey, translationPromise);
+      serviceResults = await translationPromise;
+    }
+  }
+  const final = translations2.map((tr, idx) => {
+    const from = (tr[API_FIELD_FROM] || "").toLowerCase();
+    const to = (tr[API_FIELD_TO] || "").toLowerCase();
+    if (from === to) return { [API_FIELD_TEXT]: tr[API_FIELD_TEXT] };
+    const svcIdx = indexMap.indexOf(idx);
+    if (svcIdx !== -1) return serviceResults[svcIdx] || { [API_FIELD_TEXT]: tr[API_FIELD_TEXT] };
+    return { [API_FIELD_TEXT]: tr[API_FIELD_TEXT] };
+  });
+  return final;
+}
+
+// src/utils/localizeLanguageNames.ts
+var CACHE_TTL_MS = 7 * 24 * 60 * 60 * 1e3;
+var NAME_CTX = "language name";
+async function translateNames(names, targetLang, options) {
+  const requests = names.map((name) => ({
+    [API_FIELD_TEXT]: name,
+    [API_FIELD_FROM]: "en",
+    [API_FIELD_TO]: targetLang,
+    [API_FIELD_CTX]: NAME_CTX
+  }));
+  try {
+    const results = await translateBatch(requests, options);
+    const map = {};
+    names.forEach((name, i) => {
+      const translated = results[i]?.[API_FIELD_TEXT];
+      if (translated) map[name] = translated;
+    });
+    return map;
+  } catch (error) {
+    devDebug("[localizeLanguageNames] translate failed:", error);
+    return null;
+  }
+}
+async function localizeLanguageNames(languages, targetLang, options = {}) {
+  const to = (targetLang || "").toLowerCase();
+  if (!to || to === "en" || languages.length === 0) return languages;
+  const cacheKey = `langie_langnames_${to}`;
+  let map = getCache(cacheKey);
+  if (!map) {
+    const names = [...new Set(languages.map((l) => l.name).filter(Boolean))];
+    map = await translateNames(names, to, options);
+    if (map && Object.keys(map).length) setCache(cacheKey, map, CACHE_TTL_MS);
+  }
+  if (!map) return languages;
+  const resolved = map;
+  return languages.map((l) => ({ ...l, search_alias: resolved[l.name] || l.search_alias }));
+}
+
 // src/composables/useLangie-core.ts
 var availableLanguages = (0, import_vue4.ref)([]);
 var translations = (0, import_vue4.reactive)({});
@@ -1268,6 +1490,16 @@ function useLangieCore(options = {}) {
       devDebug("[useLangie] No cached languages found");
     }
   }
+  const applyLocalizedNames = (lang) => {
+    const base = availableLanguages.value;
+    if (!base.length) return;
+    localizeLanguageNames(base, lang, { translatorHost }).then((localized) => {
+      if (localized !== base && availableLanguages.value === base) {
+        availableLanguages.value = localized;
+      }
+    }).catch(() => {
+    });
+  };
   const setLanguage = (lang) => {
     if (lang && lang !== currentLanguage.value) {
     }
@@ -1275,6 +1507,7 @@ function useLangieCore(options = {}) {
     if (typeof window !== "undefined") {
       localStorage.setItem("interface_language", lang);
     }
+    applyLocalizedNames(lang);
   };
   const fetchLanguages = async (opts = {}) => {
     const { force = false, country: explicitCountry } = opts;
@@ -1375,6 +1608,7 @@ function useLangieCore(options = {}) {
       }
       _languagesCache = filtered;
       _languagesPromise = null;
+      applyLocalizedNames(currentLanguage.value);
       return filtered;
     } catch (error) {
       devDebug("[useLangie] Language fetch error:", { error });