@genesislcap/foundation-i18n 14.160.1 → 14.162.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +114 -5
- package/package.json +9 -9
package/README.md
CHANGED
|
@@ -1,11 +1,121 @@
|
|
|
1
1
|
# Genesis Foundation i18n
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
[](https://www.typescriptlang.org/)
|
|
3
|
+
The `@genesislcap/foundation-i18n` package provides a collection of i18n services and utilities for Genesis applications. It leverages the power of [i18next](https://www.i18next.com/) to enable seamless internationalization and localization.
|
|
5
4
|
|
|
6
|
-
|
|
5
|
+
### API Documentation
|
|
7
6
|
|
|
8
|
-
|
|
7
|
+
For more detailed information on API and configurations, please refer to the [API documentation](docs/api/index.md) in the `docs/api` directory.
|
|
8
|
+
|
|
9
|
+
## Features
|
|
10
|
+
|
|
11
|
+
- **Easy integration**: Quick setup with modern JavaScript frameworks and libraries.
|
|
12
|
+
- **Dynamic language switching**: Change languages on the fly without reloading the application.
|
|
13
|
+
- **Module federation support**: Share and load translations across different micro-frontends or modules dynamically.
|
|
14
|
+
- **Dependency injection**: Integrate i18n services into your components using dependency injection.
|
|
15
|
+
|
|
16
|
+
## Project Structure
|
|
17
|
+
|
|
18
|
+
- `src/`: Source code for the library, including the core `i18n` functionality and utility functions.
|
|
19
|
+
- `i18n/`: Core internationalization logic and configurations.
|
|
20
|
+
- `utils/`: Utility functions supporting the core features.
|
|
21
|
+
- `docs/`: Documentation, including API details and usage guides.
|
|
22
|
+
|
|
23
|
+
## Getting Started
|
|
24
|
+
|
|
25
|
+
### Installation
|
|
26
|
+
|
|
27
|
+
To enable this module in your application, follow the steps below.
|
|
28
|
+
|
|
29
|
+
1. Add `@genesislcap/foundation-i18n` as a dependency in your `package.json` file. Whenever you change the dependencies of your project, ensure you run the `$ npm run bootstrap` command again. You can find more information in the [package.json basics](https://learn.genesis.global/secure/web/basics/package-json-basics/) page.
|
|
30
|
+
|
|
31
|
+
```json
|
|
32
|
+
{
|
|
33
|
+
...
|
|
34
|
+
"dependencies": {
|
|
35
|
+
...
|
|
36
|
+
"@genesislcap/foundation-i18n": "latest"
|
|
37
|
+
...
|
|
38
|
+
},
|
|
39
|
+
...
|
|
40
|
+
}
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
### Basic Setup
|
|
44
|
+
|
|
45
|
+
Import the necessary modules from `@genesislcap/foundation-i18n` and configure your internationalization settings.
|
|
46
|
+
|
|
47
|
+
```typescript
|
|
48
|
+
import { defaultI18nextConfig, I18nextConfig } from '@genesislcap/foundation-i18n';
|
|
49
|
+
|
|
50
|
+
// Tip: Extend or modify the defaultI18nextConfig as needed.
|
|
51
|
+
Registration.instance<I18nextConfig>(I18nextConfig, {
|
|
52
|
+
...defaultI18nextConfig,
|
|
53
|
+
lng: 'pt', // en is the default language but you can change it here or by tweaking the defaultI18nextConfig
|
|
54
|
+
resources: {
|
|
55
|
+
en: {
|
|
56
|
+
translation: {
|
|
57
|
+
Home: 'Home',
|
|
58
|
+
Admin: 'Admin',
|
|
59
|
+
Reporting: 'Reporting',
|
|
60
|
+
Notifications: 'Notifications',
|
|
61
|
+
['Features Lab']: 'Features Lab',
|
|
62
|
+
},
|
|
63
|
+
},
|
|
64
|
+
pt: {
|
|
65
|
+
translation: {
|
|
66
|
+
Home: 'Início',
|
|
67
|
+
Admin: 'Administração',
|
|
68
|
+
Reporting: 'Relatórios',
|
|
69
|
+
Notifications: 'Notificações',
|
|
70
|
+
['Features Lab']: 'Laboratório de Funcionalidades',
|
|
71
|
+
},
|
|
72
|
+
},
|
|
73
|
+
},
|
|
74
|
+
});
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
This could live in your application’s entry point, such as `main.ts` or a similar file.
|
|
78
|
+
|
|
79
|
+
### Usage
|
|
80
|
+
|
|
81
|
+
`foundation-i18n` also supports changing languages dynamically, allowing your application to switch languages without needing to reload:
|
|
82
|
+
|
|
83
|
+
```typescript
|
|
84
|
+
import { i18next } from '@genesislcap/foundation-i18n';
|
|
85
|
+
import { customElement, FASTElement, html } from '@microsoft/fast-element';
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
@customElement({
|
|
89
|
+
name: 'my-component',
|
|
90
|
+
template: html`
|
|
91
|
+
<zero-button @click=${() => switchLanguage()}>Switch between PT and EN</zero-button>
|
|
92
|
+
<zero-button @click=${() => translateWords()}>Translate i18n Resource Words</zero-button>
|
|
93
|
+
`,
|
|
94
|
+
})
|
|
95
|
+
export class MyComponent extends FASTElement {
|
|
96
|
+
@I18next i18next!: I18next;
|
|
97
|
+
|
|
98
|
+
switchLanguage() {
|
|
99
|
+
if (this.i18next.language === 'pt') {
|
|
100
|
+
this.i18next.changeLanguage('en');
|
|
101
|
+
} else {
|
|
102
|
+
this.i18next.changeLanguage('pt');
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
translateWords() {
|
|
107
|
+
console.log(this.i18next.t('Home')); // if pt, it will log Início, if en, it will log Home
|
|
108
|
+
console.log(this.i18next.t('Admin')); // if pt, it will log Administração, if en, it will log Admin
|
|
109
|
+
console.log(this.i18next.t('Reporting')); // if pt, it will log Relatórios, if en, it will log Reporting
|
|
110
|
+
console.log(this.i18next.t('Notifications')); // if pt, it will log Notificações, if en, it will log Notifications
|
|
111
|
+
console.log(this.i18next.t('Features Lab')); // if pt, it will log Laboratório de Funcionalidades, if en, it will log Features Lab
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
### Integrating with Other Libraries
|
|
117
|
+
|
|
118
|
+
Coming soon.
|
|
9
119
|
|
|
10
120
|
## License
|
|
11
121
|
|
|
@@ -13,4 +123,3 @@ Note: this project provides front-end dependencies and uses licensed components
|
|
|
13
123
|
|
|
14
124
|
### Licensed components
|
|
15
125
|
Genesis low-code platform
|
|
16
|
-
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@genesislcap/foundation-i18n",
|
|
3
3
|
"description": "Foundation components and services for Internationalization (i18n) support",
|
|
4
|
-
"version": "14.
|
|
4
|
+
"version": "14.162.0",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"license": "SEE LICENSE IN license.txt",
|
|
7
7
|
"main": "dist/esm/index.js",
|
|
@@ -22,16 +22,16 @@
|
|
|
22
22
|
"serve": "genx serve"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
|
-
"@genesislcap/genx": "14.
|
|
26
|
-
"@genesislcap/rollup-builder": "14.
|
|
27
|
-
"@genesislcap/ts-builder": "14.
|
|
28
|
-
"@genesislcap/uvu-playwright-builder": "14.
|
|
29
|
-
"@genesislcap/vite-builder": "14.
|
|
30
|
-
"@genesislcap/webpack-builder": "14.
|
|
25
|
+
"@genesislcap/genx": "14.162.0",
|
|
26
|
+
"@genesislcap/rollup-builder": "14.162.0",
|
|
27
|
+
"@genesislcap/ts-builder": "14.162.0",
|
|
28
|
+
"@genesislcap/uvu-playwright-builder": "14.162.0",
|
|
29
|
+
"@genesislcap/vite-builder": "14.162.0",
|
|
30
|
+
"@genesislcap/webpack-builder": "14.162.0",
|
|
31
31
|
"rimraf": "^3.0.2"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@genesislcap/foundation-logger": "14.
|
|
34
|
+
"@genesislcap/foundation-logger": "14.162.0",
|
|
35
35
|
"@microsoft/fast-element": "^1.12.0",
|
|
36
36
|
"@microsoft/fast-foundation": "^2.49.4",
|
|
37
37
|
"i18next": "^20.3.0",
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"publishConfig": {
|
|
46
46
|
"access": "public"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "874e7ee403e4cfab01c6fb2542ae3264c7202831"
|
|
49
49
|
}
|