UNPKG

@lion/ui

Version:

A package of extendable web components

github.com/ing-bank/lion/

ing-bank/lion

70 lines (60 loc) • 49.2 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
--- parts: - API Table - Localize - Systems title: 'Localize: API Table' eleventyNavigation: key: API Table >> Localize >> Systems title: API Table order: 90 parent: Systems >> Localize --- # Localize: API Table ## class: `LocalizeManager` ### Fields | Name | Privacy | Type | Default | Description | Inherited From | | ---------------------------------- | --------- | --------- | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | -------------- | | `formatDateOptions` | public | `object` | `{ /** @type {Map<string, DatePostProcessor>} */ postProcessors: new Map(), }` | The localize system uses (normalized) Intl for formatting dates.&#xA;It's possible to customize this output per locale | | | `formatNumberOptions` | public | `object` | `{ returnIfNaN: '', /** @type {Map<string, NumberPostProcessor>} */ postProcessors: new Map(), }` | The localize system uses (normalized) Intl for formatting numbers.&#xA;It's possible to customize this output per locale | | | `loadingComplete` | public | | | | | | `locale` | public | | | | | | `_autoLoadOnLocaleChange` | protected | `boolean` | `!!autoLoadOnLocaleChange` | | | | `_fallbackLocale` | protected | | `fallbackLocale` | | | | `_langAttrSetByTranslationTool` | protected | | | | | | `_showKeyAsFallback` | protected | | `showKeyAsFallback` | | | | `_supportExternalTranslationTools` | protected | | | | | ### Methods | Name | Privacy | Description | Parameters | Return | Inherited From | | ------------------------------------ | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------- | ----------------------- | -------------- | | `addData` | public | | `locale: string, namespace: string, data: object` | | | | `loadNamespace` | public | | `namespaceObj: NamespaceObject, { locale = this.locale }, options: @param {string} [options.locale] * ` | `Promise<Object\|void>` | | | `loadNamespaces` | public | | `namespaces: NamespaceObject[], { locale }, options: @param {string} [options.locale] * ` | `Promise<Object>` | | | `msg` | public | | `keys: string \| string[], vars: Object<string,?>, opts: @param {string} [opts.locale] * ` | `string` | | | `reset` | public | | | | | | `setDatePostProcessorForLocale` | public | | `{ locale, postProcessor }, options: {locale:string, postProcessor:DatePostProcessor}` | | | | `setNumberPostProcessorForLocale` | public | | `{ locale, postProcessor }, options: {locale:string, postProcessor:NumberPostProcessor}` | | | | `setupNamespaceLoader` | public | | `pattern: RegExp\|string, loader: function` | | | | `teardown` | public | | | | | | `_cacheNamespaceLoaderPromise` | protected | | `locale: string, namespace: string, promise: Promise<Object\|void>` | | | | `_getCachedNamespaceLoaderPromise` | protected | | `locale: string, namespace: string` | | | | `_getLangFromLocale` | protected | | `locale: string` | `string` | | | `_getMessageForKey` | protected | | `key: string \| undefined, locale: string` | `string` | | | `_getMessageForKeys` | protected | | `keys: string \| string[], locale: string` | `string \| undefined` | | | `_getNamespaceLoader` | protected | | `namespaceObj: NamespaceObject, isDynamicImport: boolean, namespace: string` | | | | `_getNamespaceLoaderPromise` | protected | | `loader: function, locale: string, namespace: string, fallbackLocale: string` | `Promise<any>` | | | `_isNamespaceInCache` | protected | | `locale: string, namespace: string` | | | | `_loadAllMissing` | protected | | `newLocale: string, oldLocale: string` | | | | `_loadNamespaceData` | protected | | `locale: string, namespaceObj: NamespaceObject, isDynamicImport: boolean, namespace: string` | `Promise<Object\|void>` | | | `_lookupNamespaceLoader` | protected | | `namespace: string` | `function\|null` | | | `_onLocaleChanged` | protected | | `newLocale: string, oldLocale: string` | `undefined` | | | `_setHtmlLangAttribute` | protected | | `locale: string` | | | | `_setupHtmlLangAttributeObserver` | protected | | | | | | `_setupTranslationToolSupport` | protected | This value allows for support for Google Translate (or other 3rd parties taking control&#xA;of the html\[lang] attribute).&#xA;&#xA;Have the following scenario in mind:&#xA;1\. locale is initialized by developer via html\[data-localize-lang="en-US"] and&#xA;html\[lang="en-US"]. When localize is loaded (note that this also can be after step 2 below),&#xA;it will sync its initial state from html\[data-localize-lang]&#xA;2\. Google Translate kicks in for the French language. It will set html\[lang="fr"].&#xA;This new language is not one known by us, so we most likely don't have translations for&#xA;this file. Therefore, we do NOT sync this value to LocalizeManager. The manager should&#xA;still ask for known resources (in this case for locale 'en-US')&#xA;3\. locale is changed (think of a language dropdown)&#xA;It's a bit of a weird case, because we would not expect an end user to do this. If he/she&#xA;does, make sure that we do not go against Google Translate, so we maintain accessibility&#xA;(by not altering html\[lang]). We detect this by reading #localeSetByTranslationTool:&#xA;when its value is null, we consider Google translate 'not active'.&#xA;&#xA;When Google Translate is turned off by the user (html\[lang=auto]),&#xA;\`localize.locale\` will be synced to html\[lang] again&#xA;&#xA;Keep in mind that all of the above also works with other tools than Google Translate,&#xA;but this is the most widely used tool and therefore used as an example. | | | | | `_teardownHtmlLangAttributeObserver` | protected | | | | | ### Events | Name | Type | Description | Inherited From | | ------------------ | ------------- | ----------- | -------------- | | `__localeChanging` | `CustomEvent` | | | | `localeChanged` | `CustomEvent` | | | <hr/>