# @coveops/localization-manager

> Encapsulates the setup required for customizing and adding additional entries to the localization dictionary

Latest version **1.0.1** (published 2021-03-11) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @coveops/localization-manager
pnpm add @coveops/localization-manager
yarn add @coveops/localization-manager
bun add @coveops/localization-manager
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2021-03-11 |
| First published | 2020-08-11 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 17.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | cricha, jpdery26, lpblais-coveo, coveoit, yass1408, gfoumbi, rvundavalli, jwolfe-coveo, sfecteau, mthusscoveo, jfleurent, eqcoveo, jmdro, davebouffard, jfallaire, achouan, hsinghcoveo, wnijmeijer, lgcarrierbedard, elafleur_coveo, plavigueur, eaubin |

## Links

- npm: https://www.npmjs.com/package/@coveops/localization-manager
- npm.io page: https://npm.io/package/@coveops/localization-manager

## Dependencies (1)

- [coveo-search-ui](https://npm.io/package/coveo-search-ui.md) ^2.9373.8

## Recent versions

- 1.0.1 (latest) — 2021-03-11
- 1.0.0 — 2020-08-11

## README

# LocalizationManager

Encapsulates the setup required for customizing and adding additional entries to the localization dictionary

Disclaimer: This component was built by the community at large and is not an official Coveo JSUI Component. Use this component at your own risk.

## Prerequisites

1. `@coveops/cli` version 0.10.0 or later must be installed to support localization with this component.

## Getting Started

1. Install the component into your project.

```
npm i @coveops/localization-manager
```

2. Use the Component or extend it

Typescript:

```javascript
import * as LocalizationManager from '@coveops/localization-manager';
```

Javascript

```javascript
const LocalizationManager = require('@coveops/localization-manager');
```

3. You can also expose the component alongside other components being built in your project.

```javascript
export * as LocalizationManager from '@coveops/localization-manager'
```

4. Or for quick testing, you can add the script from unpkg

```html
<script src="https://unpkg.com/@coveops/localization-manager@latest/dist/index.min.js"></script>
```

> Disclaimer: Unpkg should be used for testing but not for production.

5. Expose the custom locale file using a script tag.

This locale should correspond to the one you used with Coveo.

```html
<script src="https://static.cloud.coveo.com/searchui/v2.8864/js/cultures/fr.js"></script>
```

The locales must match in order for localization to work. This can be automated using backend template rendering where suited by replacing the locale with a variable as relevant.

```html
<script src="locales/fr.js"></script>
```

Adding the locales file generated by the build will expose a global `LOCALES` variable that can then be passed to the `LocalizationManger` to manage the remaining steps for you.

5. Include the component in your template as follows:

Add the following execution to your code once the page has initialized:

```html
<script>
    CoveoLocalizationManager(LOCALES)        
</script>
```

If the component is being bundled amongst other components, it will be available on the Coveo object.

```html
<script>
    Coveo.LocalizationManager(LOCALES)        
</script>
```

Be sure to update the variables to have the relevant information.

## Options

The following options can be configured:

| Option | Required | Type | Default | Notes |
| --- | --- | --- | --- | --- |
| `locales` | Yes | object | | An object containing all of the translations for the given locale. |
| `components` | No | string[] | | An array of component names to target ex: `DynamicFacet` |
| `searchInterface` | No | Element | | The search interface to target when setting up localization. By default, all search interfaces on the page will be targeted. |
| `options` | No | object | {} | An object with additional options to configure as detailed in the following entries |
| `options.disableTargetting` | No | boolean | `false` | Tells the localization manager to only set the global translation dictionary and not to pass the definitions as `valueCaptions` to targeted components. A targeted component can be specified with the `components` option or by specifying the `target` option with the `create:translation` command. |

## Managing Translations

With this component installed, and `@coveops/cli` version 0.10.0 or newer, the following CLI commands can be used to add localization to your project:

1. Add locales for the languages you will support. Adding another language later on will create placeholders from your default language. By default the CLI uses `en`.

```bash
npx @coveops/cli create:locales en fr
```

2. Add translations for terms you want to replace.

```bash
npx @coveops/cli create:translation City --en City --fr Ville
```

3. Override translation terms for a given component or element with a queryable id.

```bash
npx @coveops/cli create:translation City --en City --fr Ville --target DynamicFacet
```

## Contribute

1. Clone the project
2. Copy `.env.dist` to `.env` and update the COVEO_ORG_ID and COVEO_TOKEN fields in the `.env` file to use your Coveo credentials and SERVER_PORT to configure the port of the sandbox - it will use 8080 by default.
3. Build the code base: `npm run build`
4. Serve the sandbox for live development `npm run serve`

---
_Source: https://npm.io/package/@coveops/localization-manager · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._