feat(docs): add translations for doc search (#15180)

docs/.vitepress/crowdin/en-US/component/search.json

@@ -1,5 +1,47 @@
 {
-  "search": "Search",
-  "empty": "No results",
-  "index": "en"
+  "algolia": {
+    "placeholder": "Search docs",
+    "translations": {
+      "button": {
+        "buttonText": "Search",
+        "buttonAriaLabel": "Search"
+      },
+      "modal": {
+        "searchBox": {
+          "resetButtonTitle": "Clear the query",
+          "resetButtonAriaLabel": "Clear the query",
+          "cancelButtonText": "Cancel",
+          "cancelButtonAriaLabel": "Cancel"
+        },
+        "startScreen": {
+          "recentSearchesTitle": "Recent",
+          "noRecentSearchesText": "No recent searches",
+          "saveRecentSearchButtonTitle": "Save this search",
+          "removeRecentSearchButtonTitle": "Remove this search from history",
+          "favoriteSearchesTitle": "Favorite",
+          "removeFavoriteSearchButtonTitle": "Remove this search from favorites"
+        },
+        "errorScreen": {
+          "titleText": "Unable to fetch results",
+          "helpText": "You might want to check your network connection."
+        },
+        "footer": {
+          "selectText": "to select",
+          "selectKeyAriaLabel": "Enter key",
+          "navigateText": "to navigate",
+          "navigateUpKeyAriaLabel": "Arrow up",
+          "navigateDownKeyAriaLabel": "Arrow down",
+          "closeText": "to close",
+          "closeKeyAriaLabel": "Escape key",
+          "searchByText": "Search by"
+        },
+        "noResultsScreen": {
+          "noResultsText": "No results for",
+          "suggestedQueryText": "Try searching for",
+          "reportMissingResultsText": "Believe this query should return results?",
+          "reportMissingResultsLinkText": "Let us know."
+        }
+      }
+    }
+  }
 }

docs/.vitepress/vitepress/components/navbar/vp-search.vue

@@ -6,6 +6,7 @@ import docsearch from '@docsearch/js'
 import { isClient } from '@vueuse/core'
 import { useLang } from '../../composables/lang'
 // import type { DefaultTheme } from '../config'
+import searchLocale from '../../../i18n/component/search.json'
 import type { DocSearchHit } from '@docsearch/react/dist/esm/types'
 
 const props = defineProps<{
@@ -58,11 +59,14 @@ function initialize(userOptions: any) {
   // if the user has multiple locales, the search results should be filtered
   // based on the language
   const facetFilters = props.multilang ? [`language:${lang.value}`] : []
+  const algoliaLocale = searchLocale[lang.value].algolia
 
   docsearch(
     Object.assign({}, userOptions, {
       container: '#docsearch',
       indexName: 'element-plus',
+      placeholder: algoliaLocale.placeholder,
+      translations: algoliaLocale.translations,
       searchParameters: Object.assign({}, userOptions.searchParameters, {
         // pass a custom lang facetFilter to allow multiple language search
         // https://github.com/algolia/docsearch-configs/pull/3942