@progress/kendo-angular-intl
Version:
Kendo UI Internationalization for Angular components
543 lines (531 loc) • 19.3 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import * as i0 from '@angular/core';
import { EventEmitter, LOCALE_ID, Injectable, Inject, Pipe, NgModule } from '@angular/core';
import { validatePackage } from '@progress/kendo-licensing';
import * as intl from '@progress/kendo-intl';
/**
* @hidden
*/
const packageMetadata = {
name: '@progress/kendo-angular-intl',
productName: 'Kendo UI for Angular',
productCode: 'KENDOUIANGULAR',
productCodes: ['KENDOUIANGULAR'],
publishDate: 1751462926,
version: '19.2.0',
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
};
const DOCS_URL = 'https://www.telerik.com/kendo-angular-ui/components/internationalization/troubleshooting/';
/**
* @hidden
*/
const errorSolutions = {
'NoCurrency': `Solution: ${DOCS_URL}#toc-no-currency`,
'NoCurrencyDisplay': `Solution: ${DOCS_URL}#toc-no-currency-display`,
'NoCurrencyRegion': `Solution: ${DOCS_URL}#toc-no-currency-region`,
'NoDateFieldNames': `Solution: ${DOCS_URL}#toc-no-date-filed-names`,
'NoFirstDay': `Solution: ${DOCS_URL}#toc-no-first-day`,
'NoGMTInfo': `Solution: ${DOCS_URL}#toc-no-gmt-info`,
'NoLocale': `Solution: ${DOCS_URL}#toc-no-locale`,
'NoValidCurrency': `Solution: ${DOCS_URL}#toc-no-valid-currency`,
'NoWeekData': `Solution: ${DOCS_URL}#toc-no-week-data`
};
function formatMessage(error) {
const message = error.message;
const errorSolution = errorSolutions[Object.keys(errorSolutions).filter(key => message.indexOf(key) === 0)[0]];
return errorSolution ? `${message} ${errorSolution}` : message;
}
// eslint-disable-next-line @typescript-eslint/ban-types
function intlMethod(fn) {
return function (...values) {
try {
return fn(...values);
}
catch (error) {
error.message = formatMessage(error);
throw error;
}
};
}
/**
* Wraps Kendo Intl methods to provide enhanced error handling and documentation for the Kendo Angular Intl package.
*
* Includes utility functions for formatting, parsing, and retrieving locale data, as well as error message enhancements.
*
* @example
* ```ts
* import { formatDate, parseNumber, localeData } from '@progress/kendo-angular-intl';
* const formatted = formatDate(new Date(), { date: 'short' });
* ```
*/
/**
* @hidden
*/
const dateFormatNames = intlMethod(intl.dateFormatNames);
/**
* @hidden
*/
const dateFieldName = intlMethod(intl.dateFieldName);
/**
* @hidden
*/
const firstDay = intlMethod(intl.firstDay);
/**
* @hidden
*/
const format = intlMethod(intl.format);
/**
* @hidden
*/
const formatDate = intlMethod(intl.formatDate);
/**
* @hidden
*/
const formatNumber = intlMethod(intl.formatNumber);
/**
* @hidden
*/
const load = intlMethod(intl.load);
/**
* @hidden
*/
const numberSymbols = intlMethod(intl.numberSymbols);
/**
* @hidden
*/
const parseDate = intlMethod(intl.parseDate);
/**
* @hidden
*/
const parseNumber = intlMethod(intl.parseNumber);
/**
* @hidden
*/
const splitDateFormat = intlMethod(intl.splitDateFormat);
/**
* @hidden
*/
const toString = intlMethod(intl.toString);
/**
* @hidden
*/
const weekendRange = intlMethod(intl.weekendRange);
/**
* Sets a pre-built locale.
*
* @param data - The pre-built locale data.
*/
const setData = (data) => intl.setData(data);
/**
* Retrieves the locale data for the specified locale.
*
* @param locale - The locale ID.
* @returns The locale data.
*/
const localeData = (locale) => {
try {
return intl.localeInfo(locale);
}
catch (error) {
error.message = formatMessage(error);
throw error;
}
};
const LOCALE_REGEX = /_/g;
/**
* @hidden
*/
function cldrServiceFactory(localeId) {
return new CldrIntlService(localeId);
}
/**
* Represents the abstract base class for the Kendo UI for Angular Internationalization service.
* Provides methods for formatting and parsing dates, numbers, and strings according to the current locale.
*
* Extend this class to implement custom internationalization logic or use the default CLDR-based implementation.
*/
class IntlService {
/**
* @hidden
*/
changes = new EventEmitter();
/**
* @hidden
*/
constructor() {
validatePackage(packageMetadata);
}
/**
* Specifies that the service was changed.
*/
notify() {
this.changes.emit();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlService, providedIn: 'root', useFactory: cldrServiceFactory, deps: [{ token: LOCALE_ID }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
useFactory: cldrServiceFactory,
deps: [LOCALE_ID]
}]
}], ctorParameters: function () { return []; } });
/**
* Represents the Internationalization service implemented using the CLDR Database via the `@progress/kendo-intl` package.
* Provides locale-aware formatting and parsing for dates, numbers, and strings.
*
* @example
* ```ts
* import { CldrIntlService } from '@progress/kendo-angular-intl';
* const intl = new CldrIntlService('en-US');
* intl.formatDate(new Date(), { date: 'short' });
* ```
*/
class CldrIntlService extends IntlService {
locale;
/**
* Specifies or gets the current locale ID.
*/
get localeId() {
return this.locale;
}
set localeId(value) {
// Angular locales use underscore, for example, en_US
// while IETF BCP-47 specifies a dash.
// https://tools.ietf.org/html/bcp47
const locale = value.replace(LOCALE_REGEX, '-');
if (locale !== this.locale) {
this.locale = locale;
this.notify();
}
}
/**
* Creates a new instance of the service with the ID of the specified locale.
*
* Note that the parts of the locale ID can be separated by either `_` (underscore)
* or `-` (dash).
*
* @param localeId - The default locale ID.
*/
constructor(localeId) {
super();
this.localeId = localeId;
}
/**
* Formats a string with placeholders such as
* `Total amount {0:c}`.
*
* @param format - The format string.
* @param values - One or more values to output in the format string placeholders.
* @returns The formatted string.
*/
format(format$1, ...values) {
return format(format$1, values, this.localeId);
}
/**
* Converts an object into a string based on the specified format.
*
* @param value - The value to format.
* @param format - The format to use.
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The formatted object as a string.
*/
toString(value, format, localeId) {
return toString(value, format, localeId || this.localeId);
}
/**
* Converts a `Date` object into a string based on the specified format.
* If no format is provided, the default short date format is used.
*
* @param value - The date to format.
* @param format - The format string or options (optional).
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The formatted date as a string.
*/
formatDate(value, format, localeId) {
return formatDate(value, format, localeId || this.localeId);
}
/**
* Converts a string into a `Date` object based on the specified format.
*
* @param value - The string to convert.
* @param format - The format strings or options (optional).
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The parsed date.
*/
parseDate(value, format, localeId) {
return parseDate(value, format, localeId || this.localeId);
}
/**
* Converts a string into a `Number`.
*
* @param value - The string to convert.
* @param format - The format string or options (optional).
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The parsed number.
*/
parseNumber(value, format, localeId) {
return parseNumber(value, localeId || this.localeId, format);
}
/**
* Converts a `Number` into a string based on the specified format.
*
* @param value - The number to format.
* @param format - The format string or options.
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The formatted number as a string.
*/
formatNumber(value, format, localeId) {
return formatNumber(value, format, localeId || this.localeId);
}
/**
* Returns the date names from the current locale based on the option.
*
* The available `type` values are:
* - `era`
* - `year`
* - `quarter`
* - `month`
* - `week`
* - `day`
* - `dayperiod`
* - `hour`
* - `minute`
* - `second`
* - `zone`
*
* The available `nameType` values are:
* - `wide`
* - `narrow`
* - `short`
*
* @param options - Detailed configuration for the desired date field name.
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The day names from the current locale based on the option.
*
* @example
* ```ts
* dateFieldName({ type: 'day' }); //returns 'day';
* dateFieldName({ type: 'day', nameType: 'wide' }); //returns 'day';
* dateFieldName({ type: 'month', nameType: 'short' }); //returns 'mo.';
* dateFieldName({ type: 'month', nameType: 'wide' }); //returns 'month';
* ```
*/
dateFieldName(options, localeId) {
return dateFieldName(options, localeId || this.localeId);
}
/**
* Returns a localized date field name based on specific `dateFieldName` options.
*
* The available type values are:
* - `day`
* - `dayperiod`
* - `months`
* - `quarters`
* - `eras`
*
* @param options - Detailed configuration for the desired date format.
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The day names from the current locale based on the option.
*/
dateFormatNames(options, localeId) {
return dateFormatNames(localeId || this.localeId, options);
}
/**
* Splits the date format into objects containing information about each part of the pattern.
*
* @param format - The format string or options.
* @param localeId - The locale ID to use (optional). If not specified, the `"en"` locale ID is used.
* @returns The date format parts.
*/
splitDateFormat(format, localeId) {
return splitDateFormat(format, localeId || this.localeId);
}
/**
* Returns the number symbols from the current locale based on the option.
*
* @param localeId - The locale ID to use in place of the default one (optional).
* @returns The number symbols from the current locale.
*/
numberSymbols(localeId) {
return numberSymbols(localeId || this.localeId);
}
/**
* Returns the first day index starting from Sunday.
*
* @param localeId - The locale ID (optional). Defaults to the current locale ID.
* @returns The index of the first day of the week (0 == Sunday).
*/
firstDay(localeId) {
return firstDay(localeId || this.localeId);
}
/**
* Returns the start and end index of the locale weekend starting from Sunday.
*
* @param localeId - The locale ID (optional). Defaults to the current locale ID.
* @returns The start and end index of the locale weekend (0 == Sunday).
*/
weekendRange(localeId) {
return weekendRange(localeId || this.localeId);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CldrIntlService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CldrIntlService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CldrIntlService, decorators: [{
type: Injectable
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
type: Inject,
args: [LOCALE_ID]
}] }]; } });
const isNumeric = (value) => !isNaN(value - parseFloat(value));
/**
* Formats a date value to a string based on the requested format.
* This pipe uses the [IntlService]({% slug api_intl_intlservice %}).
*
* @example
* ```html
* <ul>
* <li>{{date | kendoDate }}</li>
* <li>{{milliseconds | kendoDate: 'M/dd/yyy' }}</li>
* <li>{{stringDate | kendoDate: 'G' }}</li>
* </ul>
* ```
*/
class DatePipe {
intlService;
/**
* @hidden
*/
constructor(intlService) {
this.intlService = intlService;
}
/**
* Converts a `Date` object into a string based on the specified format.
* If no format is provided, the default short date format is used.
*
* @param value - The date to format.
* @param format - The format string or options (optional).
* @param localeId - The ID of the locale which will be used instead of the default one (optional).
* @returns The formatted date as a string.
*/
transform(value, format = "", localeId) {
value = this.normalize(value);
if (value) {
return this.intlService.formatDate(value, format, localeId);
}
return value;
}
normalize(value) {
if (value && typeof value === 'string') {
value = this.intlService.parseDate(value);
}
else if (value && isNumeric(value)) {
value = new Date(parseFloat(value));
}
return value;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePipe, deps: [{ token: IntlService }], target: i0.ɵɵFactoryTarget.Pipe });
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DatePipe, isStandalone: true, name: "kendoDate" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePipe, decorators: [{
type: Pipe,
args: [{
name: 'kendoDate',
standalone: true
}]
}], ctorParameters: function () { return [{ type: IntlService }]; } });
/**
* Formats a number value to a string based on the requested format.
* This pipe uses the [`IntlService`]({% slug api_intl_intlservice %}).
*
* @example
* ```ng-template-no-run
* <ul>
* <li>{{decimal | kendoNumber:'c' }}</li>
* <li>{{stringNumber | kendoNumber:'p' }}</li>
* <li>{{int | kendoNumber:'##.00' }}</li>
* </ul>
* ```
*/
class NumberPipe {
intlService;
/**
* @hidden
*/
constructor(intlService) {
this.intlService = intlService;
}
/**
* Converts a `Number` object into a string based on the specified format.
* If no format is provided, the value is formatted as decimal number using the
* [`"n"`](https://github.com/telerik/kendo-intl/blob/master/docs/num-formatting/index.md#standard) format.
*
* @param value - The number that will be formatted.
* @param format - The format string or options (optional).
* @param localeId - The locale ID that will be used in place of the default one (optional).
* @returns The formatted number as a string.
*/
transform(value, format, localeId) {
if (typeof value === 'string') {
value = this.intlService.parseNumber(value);
}
if (value !== null && value !== undefined) {
return this.intlService.formatNumber(value, format, localeId);
}
return value;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumberPipe, deps: [{ token: IntlService }], target: i0.ɵɵFactoryTarget.Pipe });
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: NumberPipe, isStandalone: true, name: "kendoNumber" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumberPipe, decorators: [{
type: Pipe,
args: [{
name: 'kendoNumber',
standalone: true
}]
}], ctorParameters: function () { return [{ type: IntlService }]; } });
/**
* Utility array that contains all `kendoNumber` related components and directives.
*/
const KENDO_NUMBER = [
NumberPipe
];
/**
* Utility array that contains all `kendoDate` related components and directives.
*/
const KENDO_DATE = [
DatePipe
];
/**
* Utility array that contains all `@progress/kendo-angular-intl` related components and directives.
*/
const KENDO_INTL = [
...KENDO_NUMBER,
...KENDO_DATE
];
//IMPORTANT: NgModule export kept for backwards compatibility
/**
* Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
* definition for the Intl services.
*/
class IntlModule {
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: IntlModule, imports: [NumberPipe, DatePipe], exports: [NumberPipe, DatePipe] });
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlModule });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IntlModule, decorators: [{
type: NgModule,
args: [{
imports: [...KENDO_INTL],
exports: [...KENDO_INTL]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { CldrIntlService, DatePipe, IntlModule, IntlService, KENDO_DATE, KENDO_INTL, KENDO_NUMBER, NumberPipe, cldrServiceFactory, dateFieldName, dateFormatNames, firstDay, format, formatDate, formatNumber, load, localeData, numberSymbols, parseDate, parseNumber, setData, splitDateFormat, toString, weekendRange };