Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/t2ym/i18n-format
Text Formatter with CLDR Plural rules and Gender support for I18N
https://github.com/t2ym/i18n-format
cldr-plural-rules gender i18n plural-categories polymer textformatter
Last synced: 18 days ago
JSON representation
Text Formatter with CLDR Plural rules and Gender support for I18N
- Host: GitHub
- URL: https://github.com/t2ym/i18n-format
- Owner: t2ym
- License: other
- Created: 2016-01-21T01:03:28.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2023-01-05T16:15:02.000Z (almost 2 years ago)
- Last Synced: 2024-10-13T01:08:00.561Z (about 1 month ago)
- Topics: cldr-plural-rules, gender, i18n, plural-categories, polymer, textformatter
- Language: HTML
- Homepage: https://www.webcomponents.org/element/t2ym/i18n-format
- Size: 5.58 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 21
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
[](https://travis-ci.org/t2ym/i18n-format)
[](https://coveralls.io/github/t2ym/i18n-format?branch=master)
[](https://badge.fury.io/js/i18n-format)
[](https://www.webcomponents.org/element/t2ym/i18n-format)
## ``
Text formatter with [Unicode CLDR plural rules](http://cldr.unicode.org/index/cldr-spec/plural-rules) and choices (like gender) support.
[Demo](https://t2ym.github.io/i18n-format/components/i18n-format/demo/) and [API Docs](https://www.webcomponents.org/element/t2ym/i18n-format/elements/i18n-format)
### Install
```
npm install i18n-format
```
### Import
```javascript
import "i18n-format/i18n-format.js";
```
### Usage
#### Simple Template Format
```html
{1} element is effective for UI localization with {2}.
i18n-format
parameters
```
This renders as follows:
```html
i18n-format element is effective for UI localization with parameters.
```
#### Compound Template Format
An appropriate template in `json-data` is selected by plural categories, gender, etc.
```html
{
"0": "You ({3}) gave no gifts.",
"1": {
"male": "You ({3}) gave him ({4}) {5}.",
"female": "You ({3}) gave her ({4}) {5}.",
"other": "You ({3}) gave them ({4}) {5}."
},
"one": {
"male": "You ({3}) gave him ({4}) and one other person {5}.",
"female": "You ({3}) gave her ({4}) and one other person {5}.",
"other": "You ({3}) gave them ({4}) and one other person {5}."
},
"other": "You ({3}) gave them ({4}) and {1} other people gifts."
}
{{recipients.length}}
{{recipients.0.gender}}
{{sender.name}}
{{recipients.0.name}}
a gift
```
With these values for the parameters, the template path `.one.female` is selected from ``.
| Parameters | Values |
|:--------------------|:---------|
| lang | 'en' |
| recipients.length | 2 |
| recipients.0.gender | 'female' |
| sender.name | 'James' |
| recipients.0.name | 'Alice' |
So this example renders as follows:
```html
You (James) gave her (Alice) and one other person a gift.
```
[``](https://www.webcomponents.org/element/t2ym/i18n-number) specifies plural categories for
[CLDR plural rules](http://cldr.unicode.org/index/cldr-spec/plural-rules).
### Demo
#### Prerequisite for Building and Serving Demo
```sh
npm install -g polymer-cli
```
#### On-the-fly Build
```sh
# Serve at http://localhost:8080/components/i18n-format/demo/
polymer serve --npm --module-resolution=node -p 8080
```
#### Static Builds
- Build
```sh
polymer build
```
- Targets
| target | browser | minify | bundled |
|:-----:|:-------:|:------:|:-------:|
|build/esm-unbundled|es6,modules|no|no|
|build/esm-bundled |es6,modules|yes|yes|
|build/es6-bundled |es6 |yes|yes|
|build/es5-bundled |es5 |yes|yes|
- Serve
```sh
# Serve at http://localhost:8080/
cd build/{esm-unbundled|esm-bundled|es6-bundled|es5-bundled}
python -m SimpleHTTPServer 8080 # or any HTTP(S) server
```
### License
[BSD-2-Clause](https://github.com/t2ym/i18n-format/blob/master/LICENSE.md)