@progress/kendo-intl

Kendo UI Internationalization

This repository contains the source code and documentation of the Kendo UI Internationalization package.

It includes methods for parsing and formatting dates and numbers by using Unicode Common Locale Data Repository (CLDR) data. These methods are split into the following modules:

• CLDR
• Date Parsing
• Date Formatting
• Number Parsing
• Number Formatting
• General Formatting

Basic Usage

CLDR Data

To download the full CDLR database, you need to install the cldr-data module by running the following command.

npm install --save cldr-data

To apply the methods for different locales, load the likelySubtags and the locale data by using the load method.

Additionally, the library requires you to load:

• The supplemental currencyData for the default currency formatting.
• The weekData for the day of week formatting.

import { load } from '@progress/kendo-intl';

load(
    require("cldr-data/supplemental/likelySubtags.json"),
    require("cldr-data/supplemental/currencyData.json"),
    require("cldr-data/supplemental/weekData.json"),

    require("cldr-data/main/bg/numbers.json"),
    require("cldr-data/main/bg/currencies.json"),
    require("cldr-data/main/bg/ca-gregorian.json"),
    require("cldr-data/main/bg/dateFields.json"),
    require("cldr-data/main/bg/timeZoneNames.json")
);

For more examples and available configuration options, refer to the article on CLDR Data.

Date Parsing

Date parsing converts a string into a Date object by using the specific settings of the locale.

import { parseDate } from '@progress/kendo-intl';

parseDate("11/6/2000", ["G", "d"]); // Mon Nov 06 2000
parseDate("Montag, 6.11.2000", "EEEE, d.MM.y", "de"); // Mon Nov 06 2000
parseDate("2000-11-06T10:30Z"); // Mon Nov 06 2000 12:30

For more examples and available configuration options, refer to the article on date parsing.

Date Formatting

Date formatting converts a Date object into a human-readable string by using the specific settings of the locale.

import { formatDate } from '@progress/kendo-intl';

formatDate(new Date(2000, 10, 6), "d"); // 11/6/2000
formatDate(new Date(2000, 10, 6), "yMd", "de"); // 6.11.2000
formatDate(new Date(2000, 10, 6), "EEEE, d.MM.y", "bg"); // понеделник, 6.11.2000

For more examples and available configuration options, refer to the article on date formatting.

Number Parsing

Number parsing converts a string into a Number object by using the specific settings of the locale.

import { parseNumber } from '@progress/kendo-intl';

parseNumber("12.22"); // 12.22
parseNumber("1.212,22 €", "de"); // 1212.22
parseNumber("10.22 %"); // 0.1022
parseNumber("1,0000123e+4", "bg"); // 10000.123

For more examples and available configuration options, refer to the article on number parsing.

Number Formatting

Number formatting converts a Number object into a human-readable string using the specific settings of the locale.

import { formatNumber } from '@progress/kendo-intl';

formatNumber(1234.567, "n2"); // 1,234.57

formatNumber(1234.567, "c", "de"); // 1.234,57 €

formatNumber(1234.567, {
   style: "currency",
   currency: "USD",
   currencyDisplay: "displayName"
}, "bg"); // 1 234,57 щатски долара

formatNumber(2345678, "##,#.00"); // 2,345,678.00

For more examples and available configuration options, refer to the article on number formatting.

General Formatting

General formatting provides methods for independent placeholder and type formatting by using the specific settings of the locale.

import { format, toString } from '@progress/kendo-intl';

format('Date: {0:d} - Price: {1:c}', [new Date(), 10.5], "en") // Date: 1/5/2017 - Price: $10.50

toString(10.5, "c", "bg"); // 10,50 лв.

toString(new Date(), "d"); // 1/5/2017

For more examples and available configuration options, refer to the article on general formatting.

Installation

1. The Internationalization library is published as a scoped NPM package in the NPMJS Telerik account.

2. Download and install the module:

   npm install --save '@progress/kendo-intl';
   

3. Once installed, import the Internationalization in your application root module:

   // ES2015 module syntax
   import { formatDate, parseDate } from '@progress/kendo-intl';
   //or
   import { formatNumber, parseNumber } from '@progress/kendo-intl';
   

   // CommonJS format
   var numbers = require('@progress/kendo-intl/number').numbers;
   //or
   var dates = require('@progress/kendo-intl/dates').dates;