> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/algolia/docsearch/llms.txt
> Use this file to discover all available pages before exploring further.

# Translations

> Localize DocSearch UI strings for internationalization.

DocSearch supports localization through the `translations` prop. All translation strings are optional and fall back to English defaults.

## Translation Structure

The `translations` object has three main sections:

```typescript theme={null}
type DocSearchTranslations = Partial<{
  button: ButtonTranslations;        // Search button translations
  modal: ModalTranslations;          // Modal UI translations
}>;
```

## Button Translations

Translations for the search button that triggers the modal.

<ParamField path="button.buttonText" type="string" default="Search">
  Text displayed on the search button.
</ParamField>

<ParamField path="button.buttonAriaLabel" type="string" default="Search">
  Accessible label for the search button.
</ParamField>

<CodeGroup>
  ```tsx English (Default) theme={null}
  <DocSearch
    translations={{
      button: {
        buttonText: 'Search',
        buttonAriaLabel: 'Search'
      }
    }}
  />
  ```

  ```tsx French theme={null}
  <DocSearch
    translations={{
      button: {
        buttonText: 'Rechercher',
        buttonAriaLabel: 'Rechercher'
      }
    }}
  />
  ```

  ```tsx Spanish theme={null}
  <DocSearch
    translations={{
      button: {
        buttonText: 'Buscar',
        buttonAriaLabel: 'Buscar'
      }
    }}
  />
  ```
</CodeGroup>

## Modal Translations

Translations for the modal interface. The modal section is divided into multiple subsections.

### Search Box

<ParamField path="modal.searchBox.clearButtonTitle" type="string" default="Clear">
  Title for the clear button.
</ParamField>

<ParamField path="modal.searchBox.clearButtonAriaLabel" type="string" default="Clear the query">
  Accessible label for the clear button.
</ParamField>

<ParamField path="modal.searchBox.closeButtonText" type="string" default="Close">
  Text for the close button.
</ParamField>

<ParamField path="modal.searchBox.closeButtonAriaLabel" type="string" default="Close">
  Accessible label for the close button.
</ParamField>

<ParamField path="modal.searchBox.placeholderText" type="string" default="Search docs">
  Placeholder text for the search input.
</ParamField>

<ParamField path="modal.searchBox.placeholderTextAskAi" type="string" default="Ask another question...">
  Placeholder text when in Ask AI mode.
</ParamField>

<ParamField path="modal.searchBox.placeholderTextAskAiStreaming" type="string" default="Answering...">
  Placeholder text when AI is streaming a response.
</ParamField>

<ParamField path="modal.searchBox.enterKeyHint" type="string" default="Search">
  Enter key hint for standard search.
</ParamField>

<ParamField path="modal.searchBox.enterKeyHintAskAi" type="string" default="Ask">
  Enter key hint for Ask AI mode.
</ParamField>

<ParamField path="modal.searchBox.searchInputLabel" type="string" default="Search">
  Accessible label for the search input.
</ParamField>

<ParamField path="modal.searchBox.backToKeywordSearchButtonText" type="string" default="Back to keyword search">
  Text for the button that exits Ask AI mode.
</ParamField>

<ParamField path="modal.searchBox.backToKeywordSearchButtonAriaLabel" type="string" default="Back to keyword search">
  Accessible label for the back button.
</ParamField>

<ParamField path="modal.searchBox.newConversationPlaceholder" type="string" default="Ask a question">
  Placeholder text for starting a new AI conversation.
</ParamField>

<ParamField path="modal.searchBox.conversationHistoryTitle" type="string" default="My conversation history">
  Title for the conversation history screen.
</ParamField>

<ParamField path="modal.searchBox.startNewConversationText" type="string" default="Start a new conversation">
  Text for the new conversation menu item.
</ParamField>

<ParamField path="modal.searchBox.viewConversationHistoryText" type="string" default="Conversation history">
  Text for the conversation history menu item.
</ParamField>

<ParamField path="modal.searchBox.threadDepthErrorPlaceholder" type="string" default="Conversation limit reached">
  Placeholder shown when conversation depth limit is reached.
</ParamField>

### Footer

<ParamField path="modal.footer.selectText" type="string" default="Select">
  Label for the select action in keyword search mode.
</ParamField>

<ParamField path="modal.footer.submitQuestionText" type="string" default="Submit question">
  Label for the submit action in Ask AI mode.
</ParamField>

<ParamField path="modal.footer.selectKeyAriaLabel" type="string" default="Enter key">
  Accessible label for the Enter key icon.
</ParamField>

<ParamField path="modal.footer.navigateText" type="string" default="Navigate">
  Label for navigation action.
</ParamField>

<ParamField path="modal.footer.navigateUpKeyAriaLabel" type="string" default="Arrow up">
  Accessible label for the up arrow key.
</ParamField>

<ParamField path="modal.footer.navigateDownKeyAriaLabel" type="string" default="Arrow down">
  Accessible label for the down arrow key.
</ParamField>

<ParamField path="modal.footer.closeText" type="string" default="Close">
  Label for the close action in keyword search mode.
</ParamField>

<ParamField path="modal.footer.backToSearchText" type="string" default="Back to search">
  Label for the escape action in Ask AI mode.
</ParamField>

<ParamField path="modal.footer.closeKeyAriaLabel" type="string" default="Escape key">
  Accessible label for the Escape key.
</ParamField>

<ParamField path="modal.footer.poweredByText" type="string" default="Powered by">
  Text for the "Powered by" Algolia branding.
</ParamField>

### Error Screen

<ParamField path="modal.errorScreen.titleText" type="string" default="Unable to fetch results">
  Error title when search fails.
</ParamField>

<ParamField path="modal.errorScreen.helpText" type="string" default="You might want to check your network connection.">
  Error help text.
</ParamField>

### No Results Screen

<ParamField path="modal.noResultsScreen.noResultsText" type="string" default="No results found for">
  Text shown when no results are found.
</ParamField>

<ParamField path="modal.noResultsScreen.suggestedQueryText" type="string" default="Try searching for">
  Text for suggested queries section.
</ParamField>

<ParamField path="modal.noResultsScreen.reportMissingResultsText" type="string" default="Believe this query should return results?">
  Text prompting users to report missing results.
</ParamField>

<ParamField path="modal.noResultsScreen.reportMissingResultsLinkText" type="string" default="Let us know.">
  Link text for reporting missing results.
</ParamField>

### Results Screen

<ParamField path="modal.resultsScreen.askAiPlaceholder" type="string">
  Placeholder for Ask AI action in results.
</ParamField>

<ParamField path="modal.resultsScreen.noResultsAskAiPlaceholder" type="string">
  Placeholder for Ask AI action when no results are found.
</ParamField>

### Start Screen

<ParamField path="modal.startScreen.recentSearchesTitle" type="string" default="Recent">
  Title for recent searches section.
</ParamField>

<ParamField path="modal.startScreen.noRecentSearchesText" type="string">
  Text shown when there are no recent searches.
</ParamField>

<ParamField path="modal.startScreen.saveRecentSearchButtonTitle" type="string" default="Save this search">
  Title for save to favorites button.
</ParamField>

<ParamField path="modal.startScreen.removeRecentSearchButtonTitle" type="string" default="Remove this search from history">
  Title for remove from recents button.
</ParamField>

<ParamField path="modal.startScreen.favoriteSearchesTitle" type="string" default="Favorite">
  Title for favorite searches section.
</ParamField>

<ParamField path="modal.startScreen.removeFavoriteSearchButtonTitle" type="string" default="Remove this search from favorites">
  Title for remove from favorites button.
</ParamField>

<ParamField path="modal.startScreen.recentConversationsTitle" type="string" default="Recent conversations">
  Title for recent AI conversations section.
</ParamField>

<ParamField path="modal.startScreen.removeRecentConversationButtonTitle" type="string" default="Remove this conversation from history">
  Title for remove conversation button.
</ParamField>

### New Conversation Screen

<ParamField path="modal.newConversation.newConversationTitle" type="string" default="How can I help you today?">
  Title for new AI conversation screen.
</ParamField>

<ParamField path="modal.newConversation.newConversationDescription" type="string" default="I search through your documentation to help you find setup guides, feature details and troubleshooting tips, fast.">
  Description text for new conversation screen.
</ParamField>

### Ask AI Screen

<ParamField path="modal.askAiScreen.disclaimerText" type="string" default="Answers are generated with AI which can make mistakes. Verify responses.">
  Disclaimer text shown in Ask AI mode.
</ParamField>

<ParamField path="modal.askAiScreen.relatedSourcesText" type="string" default="Related sources">
  Title for related sources section.
</ParamField>

<ParamField path="modal.askAiScreen.thinkingText" type="string" default="Thinking...">
  Text shown when AI is thinking.
</ParamField>

<ParamField path="modal.askAiScreen.copyButtonText" type="string" default="Copy">
  Text for copy button.
</ParamField>

<ParamField path="modal.askAiScreen.copyButtonCopiedText" type="string" default="Copied!">
  Text shown after copying.
</ParamField>

<ParamField path="modal.askAiScreen.copyButtonTitle" type="string" default="Copy">
  Title for copy button.
</ParamField>

<ParamField path="modal.askAiScreen.likeButtonTitle" type="string" default="Like">
  Title for like button.
</ParamField>

<ParamField path="modal.askAiScreen.dislikeButtonTitle" type="string" default="Dislike">
  Title for dislike button.
</ParamField>

<ParamField path="modal.askAiScreen.thanksForFeedbackText" type="string" default="Thanks for your feedback!">
  Text shown after submitting feedback.
</ParamField>

<ParamField path="modal.askAiScreen.preToolCallText" type="string" default="Searching...">
  Text shown before AI starts searching.
</ParamField>

<ParamField path="modal.askAiScreen.duringToolCallText" type="string" default="Searching...">
  Text shown during AI search.
</ParamField>

<ParamField path="modal.askAiScreen.afterToolCallText" type="string" default="Searched for">
  Text shown after AI completes search.
</ParamField>

<ParamField path="modal.askAiScreen.stoppedStreamingText" type="string" default="You stopped this response">
  Text shown when user stops streaming.
</ParamField>

<ParamField path="modal.askAiScreen.errorTitleText" type="string" default="Chat error">
  Title for chat errors.
</ParamField>

<ParamField path="modal.askAiScreen.threadDepthExceededMessage" type="string" default="This conversation is now closed to keep responses accurate.">
  Message shown when conversation depth limit is reached.
</ParamField>

<ParamField path="modal.askAiScreen.startNewConversationButtonText" type="string" default="Start a new conversation">
  Button text for starting new conversation after error.
</ParamField>

<ParamField path="modal.askAiScreen.aggregatedToolCallNode" type="(queries: string[], onSearchQueryClick: (query: string) => void) => React.ReactNode">
  Custom JSX element for the aggregated search block. Completely overrides the default renderer.
</ParamField>

<ParamField path="modal.askAiScreen.aggregatedToolCallText" type="(queries: string[]) => { before?: string; separator?: string; lastSeparator?: string; after?: string }">
  Generate list connective parts for aggregated searches (backwards compatibility).

  ```tsx theme={null}
  translations={{
    modal: {
      askAiScreen: {
        aggregatedToolCallText: (queries) => ({
          before: 'searched for ',
          separator: ', ',
          lastSeparator: ' and ',
          after: ''
        })
      }
    }
  }}
  ```
</ParamField>

## Complete Example

<CodeGroup>
  ```tsx English (Default) theme={null}
  <DocSearch
    appId="YOUR_APP_ID"
    apiKey="YOUR_API_KEY"
    indexName="docs"
    // All defaults shown explicitly
    translations={{
      button: {
        buttonText: 'Search',
        buttonAriaLabel: 'Search'
      },
      modal: {
        searchBox: {
          clearButtonTitle: 'Clear',
          clearButtonAriaLabel: 'Clear the query',
          closeButtonText: 'Close',
          closeButtonAriaLabel: 'Close',
          placeholderText: 'Search docs',
          searchInputLabel: 'Search'
        },
        footer: {
          selectText: 'Select',
          navigateText: 'Navigate',
          closeText: 'Close',
          poweredByText: 'Powered by'
        },
        errorScreen: {
          titleText: 'Unable to fetch results',
          helpText: 'You might want to check your network connection.'
        },
        noResultsScreen: {
          noResultsText: 'No results found for',
          suggestedQueryText: 'Try searching for'
        },
        startScreen: {
          recentSearchesTitle: 'Recent',
          favoriteSearchesTitle: 'Favorite'
        }
      }
    }}
  />
  ```

  ```tsx French theme={null}
  <DocSearch
    appId="YOUR_APP_ID"
    apiKey="YOUR_API_KEY"
    indexName="docs"
    translations={{
      button: {
        buttonText: 'Rechercher',
        buttonAriaLabel: 'Rechercher'
      },
      modal: {
        searchBox: {
          clearButtonTitle: 'Effacer',
          clearButtonAriaLabel: 'Effacer la requête',
          closeButtonText: 'Fermer',
          closeButtonAriaLabel: 'Fermer',
          placeholderText: 'Rechercher dans la documentation',
          searchInputLabel: 'Rechercher'
        },
        footer: {
          selectText: 'Sélectionner',
          navigateText: 'Naviguer',
          closeText: 'Fermer',
          poweredByText: 'Propulsé par'
        },
        errorScreen: {
          titleText: 'Impossible de récupérer les résultats',
          helpText: 'Vous devriez vérifier votre connexion réseau.'
        },
        noResultsScreen: {
          noResultsText: 'Aucun résultat pour',
          suggestedQueryText: 'Essayez de rechercher'
        },
        startScreen: {
          recentSearchesTitle: 'Récent',
          favoriteSearchesTitle: 'Favori'
        }
      }
    }}
  />
  ```

  ```tsx Spanish theme={null}
  <DocSearch
    appId="YOUR_APP_ID"
    apiKey="YOUR_API_KEY"
    indexName="docs"
    translations={{
      button: {
        buttonText: 'Buscar',
        buttonAriaLabel: 'Buscar'
      },
      modal: {
        searchBox: {
          clearButtonTitle: 'Limpiar',
          clearButtonAriaLabel: 'Limpiar la consulta',
          closeButtonText: 'Cerrar',
          closeButtonAriaLabel: 'Cerrar',
          placeholderText: 'Buscar en la documentación',
          searchInputLabel: 'Buscar'
        },
        footer: {
          selectText: 'Seleccionar',
          navigateText: 'Navegar',
          closeText: 'Cerrar',
          poweredByText: 'Con tecnología de'
        },
        errorScreen: {
          titleText: 'No se pudieron obtener resultados',
          helpText: 'Debería verificar su conexión de red.'
        },
        noResultsScreen: {
          noResultsText: 'No se encontraron resultados para',
          suggestedQueryText: 'Intenta buscar'
        },
        startScreen: {
          recentSearchesTitle: 'Reciente',
          favoriteSearchesTitle: 'Favorito'
        }
      }
    }}
  />
  ```

  ```tsx German theme={null}
  <DocSearch
    appId="YOUR_APP_ID"
    apiKey="YOUR_API_KEY"
    indexName="docs"
    translations={{
      button: {
        buttonText: 'Suchen',
        buttonAriaLabel: 'Suchen'
      },
      modal: {
        searchBox: {
          clearButtonTitle: 'Löschen',
          clearButtonAriaLabel: 'Anfrage löschen',
          closeButtonText: 'Schließen',
          closeButtonAriaLabel: 'Schließen',
          placeholderText: 'Dokumentation durchsuchen',
          searchInputLabel: 'Suchen'
        },
        footer: {
          selectText: 'Auswählen',
          navigateText: 'Navigieren',
          closeText: 'Schließen',
          poweredByText: 'Bereitgestellt von'
        },
        errorScreen: {
          titleText: 'Ergebnisse konnten nicht abgerufen werden',
          helpText: 'Sie sollten Ihre Netzwerkverbindung überprüfen.'
        },
        noResultsScreen: {
          noResultsText: 'Keine Ergebnisse für',
          suggestedQueryText: 'Versuchen Sie zu suchen nach'
        },
        startScreen: {
          recentSearchesTitle: 'Zuletzt',
          favoriteSearchesTitle: 'Favoriten'
        }
      }
    }}
  />
  ```
</CodeGroup>
