8958b2fa02
- @lion/accordion@0.1.1 - @lion/ajax@0.4.3 - babel-plugin-extend-docs@0.2.2 - @lion/button@0.7.5 - @lion/calendar@0.9.4 - @lion/checkbox-group@0.10.6 - @lion/core@0.7.2 - @lion/dialog@0.7.4 - @lion/fieldset@0.13.6 - @lion/form-core@0.1.6 - @lion/form-integrations@0.1.8 - @lion/form@0.6.6 - @lion/helpers@0.5.2 - @lion/icon@0.6.4 - @lion/input-amount@0.7.6 - @lion/input-date@0.7.6 - @lion/input-datepicker@0.14.6 - @lion/input-email@0.8.6 - @lion/input-iban@0.9.6 - @lion/input-range@0.4.6 - @lion/input@0.7.6 - @lion/localize@0.12.1 - @lion/overlays@0.16.4 - @lion/radio-group@0.10.6 - remark-extend@0.2.1 - @lion/select-rich@0.18.7 - @lion/select@0.7.6 - singleton-manager@1.1.0 - @lion/steps@0.5.3 - @lion/switch@0.10.7 - @lion/tabs@0.4.4 - @lion/textarea@0.7.6 - @lion/tooltip@0.11.4 - @lion/validate-messages@0.1.6 |
||
|---|---|---|
| .. | ||
| _docs | ||
| docs | ||
| src | ||
| test | ||
| test-helpers | ||
| CHANGELOG.md | ||
| index.js | ||
| package.json | ||
| README.md | ||
| test-helpers.js | ||
Localize
export default {
title: 'Localize/Intro',
};
Is meant to translate text into multiple languages. In it's simplest form it is a function that returns the translated text for a namespace + key.
Features
- Uses es modules
- Formatting of numbers, amounts
- Formatting of dates
Further examples can be seen at Features Overview Demo and a more in depth description can be found at Localize System Overview.
Content
| Feature | Description |
|---|---|
| Translate Text | Load and translate text in multiple languages |
| Format Numbers | Format numbers in multiple languages |
| Format Dates | Format dates in multiple languages |
How to use
Installation
npm i --save @lion/localize
import { localize } from '@lion/localize';
Example
The locale which will be loaded by default is accessed via the localize.locale.
The single source of truth for page's locale is <html lang="my-LOCALE">.
At the same time the interaction should happen via localize.locale getter/setter to be able to notify and react to the change.
import { localize } from '@lion/localize.js';
localize.addEventListener('localeChanged', () => {
// do smth when data is loaded for a new locale
});
// changes locale, syncs to `<html lang="es-ES">` and fires the event above
localize.locale = 'es-ES';