feat: add i18n supports (#49)

Author: ruibaby

build.gradle

@@ -48,5 +48,5 @@ build {
 }
 
 halo {
-    version = "2.17.0"
+    version = "2.20"
 }

packages/search-widget/lit-localize.json

@@ -0,0 +1,19 @@
+{
+    "$schema": "https://raw.githubusercontent.com/lit/lit/main/packages/localize-tools/config.schema.json",
+    "sourceLocale": "en",
+    "targetLocales": [
+        "es",
+        "zh-CN",
+        "zh-TW"
+    ],
+    "tsConfig": "./tsconfig.json",
+    "output": {
+        "mode": "runtime",
+        "outputDir": "./src/generated/locales",
+        "localeCodesModule": "./src/generated/locale-codes.ts"
+    },
+    "interchange": {
+        "format": "xliff",
+        "xliffDir": "./xliff/"
+    }
+}

packages/search-widget/package.json

@@ -23,13 +23,15 @@
     "prettier": "prettier \"**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.gitignore --write"
   },
   "dependencies": {
+    "@lit/localize": "^0.12.2",
     "lit": "^3.2.0",
     "lodash-es": "^4.17.21",
     "overlayscrollbars": "^2.10.0"
   },
   "devDependencies": {
     "@iconify/json": "^2.2.234",
     "@julr/unocss-preset-forms": "^0.1.0",
+    "@lit/localize-tools": "^0.8.0",
     "@types/lodash-es": "^4.17.12",
     "@unocss/eslint-config": "^0.61.9",
     "@unocss/reset": "^0.61.9",

packages/search-widget/src/constants/index.ts

@@ -1,17 +1,2 @@
 export const HISTORY_KEY = 'halo:search-widgets:history:hits';
-export const MAX_HISTORY_ITEMS = 50;
-
-export const SHORTCUT_HELP_LIST = [
-  {
-    text: '选择',
-    kbdIcons: ['i-lucide-arrow-up', 'i-lucide-arrow-down'],
-  },
-  {
-    text: '确认',
-    kbdIcons: ['i-lucide-corner-down-left'],
-  },
-  {
-    text: '关闭',
-    kbdIcons: ['i-mdi-keyboard-esc'],
-  },
-];
+export const MAX_HISTORY_ITEMS = 50;

packages/search-widget/src/generated/locale-codes.ts

@@ -0,0 +1,27 @@
+// Do not modify this file by hand!
+// Re-generate this file by running lit-localize.
+
+/**
+ * The locale code that templates in this source code are written in.
+ */
+export const sourceLocale = `en`;
+
+/**
+ * The other locale codes that this application is localized into. Sorted
+ * lexicographically.
+ */
+export const targetLocales = [
+  `es`,
+  `zh-CN`,
+  `zh-TW`,
+] as const;
+
+/**
+ * All valid project locale codes. Sorted lexicographically.
+ */
+export const allLocales = [
+  `en`,
+  `es`,
+  `zh-CN`,
+  `zh-TW`,
+] as const;

packages/search-widget/src/generated/locales/es.ts

@@ -0,0 +1,20 @@
+
+    // Do not modify this file by hand!
+    // Re-generate this file by running lit-localize
+
+    
+    
+
+    /* eslint-disable no-irregular-whitespace */
+    /* eslint-disable @typescript-eslint/no-explicit-any */
+
+    export const templates = {
+      's5e8250fb85d64c23': `Cerrar`,
+'sa84142fc34654130': `Sin resultados de búsqueda`,
+'sad5f82f8364e5a1c': `Introducir palabras clave para buscar`,
+'sb4f1dffbb6be6302': `Borrar`,
+'sb85774dc5d18ff0f': `Confirmar`,
+'sbce70cbdb856635e': `Recientes`,
+'sfc63e31ac7c956ed': `Seleccionar`,
+    };
+  

packages/search-widget/src/generated/locales/zh-CN.ts

@@ -0,0 +1,20 @@
+
+    // Do not modify this file by hand!
+    // Re-generate this file by running lit-localize
+
+    
+    
+
+    /* eslint-disable no-irregular-whitespace */
+    /* eslint-disable @typescript-eslint/no-explicit-any */
+
+    export const templates = {
+      's5e8250fb85d64c23': `关闭`,
+'sa84142fc34654130': `没有搜索结果`,
+'sad5f82f8364e5a1c': `输入关键词以搜索`,
+'sb4f1dffbb6be6302': `清空`,
+'sb85774dc5d18ff0f': `确认`,
+'sbce70cbdb856635e': `最近搜索`,
+'sfc63e31ac7c956ed': `选择`,
+    };
+  

packages/search-widget/src/generated/locales/zh-TW.ts

@@ -0,0 +1,20 @@
+
+    // Do not modify this file by hand!
+    // Re-generate this file by running lit-localize
+
+    
+    
+
+    /* eslint-disable no-irregular-whitespace */
+    /* eslint-disable @typescript-eslint/no-explicit-any */
+
+    export const templates = {
+      's5e8250fb85d64c23': `關閉`,
+'sa84142fc34654130': `沒有搜尋結果`,
+'sad5f82f8364e5a1c': `輸入關鍵字以搜尋`,
+'sb4f1dffbb6be6302': `清空`,
+'sb85774dc5d18ff0f': `確認`,
+'sbce70cbdb856635e': `最近搜尋`,
+'sfc63e31ac7c956ed': `選擇`,
+    };
+  

packages/search-widget/src/index.ts

@@ -1,4 +1,5 @@
 import { SearchForm } from './search-form';
 import { SearchModal } from './search-modal';
+import './locale';
 
 export { SearchForm, SearchModal };

packages/search-widget/src/locale/index.ts

@@ -0,0 +1,34 @@
+import { configureLocalization, LocaleModule } from '@lit/localize';
+import * as templates_es from '../generated/locales/es';
+import * as templates_zh_CN from '../generated/locales/zh-CN';
+import * as templates_zh_TW from '../generated/locales/zh-TW';
+import { allLocales, sourceLocale, targetLocales } from '../generated/locale-codes';
+
+const localizedTemplates = new Map([
+  ['es', templates_es],
+  ['zh-CN', templates_zh_CN],
+  ['zh-TW', templates_zh_TW],
+]);
+
+const { setLocale } = configureLocalization({
+  sourceLocale,
+  targetLocales,
+  loadLocale: async (locale) => localizedTemplates.get(locale) as LocaleModule,
+});
+
+setLocale(getLocale());
+
+function getLanguageFromCookie() {
+  const match = document.cookie.match(new RegExp('(^| )language=([^;]+)'));
+  const matchedLanguage = allLocales.find((locale) => locale === match?.[2]);
+  return matchedLanguage;
+}
+
+function getLanguageFromBrowser() {
+  const language = allLocales.find((locale) => locale === navigator.language);
+  return language;
+}
+
+export function getLocale() {
+  return getLanguageFromCookie() || getLanguageFromBrowser() || sourceLocale;
+}