igniteui-webcomponents
Version:
Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.
113 lines • 4.49 kB
JavaScript
import { getCurrentI18n, getDateFormatter, getI18nManager, } from 'igniteui-i18n-core';
import { convertToCoreResource, convertToIgcResource, } from './utils.js';
class I18nController {
set locale(value) {
if (this._locale !== value) {
this._locale = value;
this._defaultResourceStrings = this._getDefaultResourceStrings();
this._host.requestUpdate();
}
}
get locale() {
return this._locale ?? getCurrentI18n();
}
set resourceStrings(value) {
if (this._resourceStrings !== value) {
if (value) {
this._customResourceStrings = this._resourceMapName
? this.getMixedResourceStrings(value)
: value;
this._resourceStrings = Object.assign({}, this._defaultResourceStrings, this._customResourceStrings);
}
else {
this._customResourceStrings = value;
this._resourceStrings = value;
}
this._host.requestUpdate();
}
}
get resourceStrings() {
return this._resourceStrings ?? this._defaultResourceStrings;
}
constructor(host, config) {
this._host = host;
this._defaultEN = config.defaultEN;
this._resourceMapName = config.resourceMapName;
this._resourceChangeCallback = config.onResourceChange;
this._defaultResourceStrings = this._getDefaultResourceStrings();
getI18nManager().registerI18n(this._defaultEN, getI18nManager().defaultLocale);
this._host.addController(this);
}
hostConnected() {
getI18nManager().addEventListener('onResourceChange', this);
}
hostDisconnected() {
getI18nManager().removeEventListener('onResourceChange', this);
}
handleEvent(event) {
this._defaultResourceStrings = this._getDefaultResourceStrings();
if (this._customResourceStrings) {
this._resourceStrings = Object.assign({}, this._defaultResourceStrings, this._customResourceStrings);
}
this._resourceChangeCallback?.call(this._host, event);
this._host.requestUpdate();
}
_getDefaultResourceStrings() {
const coreResourceStrings = getI18nManager().getCurrentResourceStrings(this.locale);
const normalizedResourceStrings = {};
const defaultComponentKeys = Object.keys(this._defaultEN);
for (const key of defaultComponentKeys) {
let resolvedValue = this._defaultEN[key];
if (key in coreResourceStrings) {
resolvedValue = coreResourceStrings[key];
}
normalizedResourceStrings[key] = resolvedValue;
}
return this.getMixedResourceStrings(normalizedResourceStrings);
}
getMixedResourceStrings(value) {
if (this._resourceMapName) {
return Object.assign({}, convertToCoreResource(value, this._resourceMapName), convertToIgcResource(value, this._resourceMapName));
}
return value;
}
}
const DATE_TIME_STYLES = new Set(['short', 'long', 'medium', 'full']);
function extractStyle(format, suffix) {
return format.toLowerCase().split(suffix)[0];
}
export function getDefaultDateTimeFormat(locale) {
return getDateFormatter().getLocaleDateTimeFormat(locale, true);
}
export function getDateTimeFormat(format, suffix = 'Date') {
return format && DATE_TIME_STYLES.has(format) ? `${format}${suffix}` : format;
}
export function formatDisplayDate(value, locale, displayFormat) {
if (!displayFormat) {
return getDateFormatter().formatDateTime(value, locale, {});
}
if (DATE_TIME_STYLES.has(displayFormat)) {
const style = displayFormat;
return getDateFormatter().formatDateTime(value, locale, {
dateStyle: style,
timeStyle: style,
});
}
if (displayFormat.endsWith('Date')) {
return getDateFormatter().formatDateTime(value, locale, {
dateStyle: extractStyle(displayFormat, 'date'),
});
}
if (displayFormat.endsWith('Time')) {
return getDateFormatter().formatDateTime(value, locale, {
timeStyle: extractStyle(displayFormat, 'time'),
});
}
return getDateFormatter().formatDateCustomFormat(value, displayFormat, {
locale,
});
}
export function addI18nController(host, config) {
return new I18nController(host, config);
}
//# sourceMappingURL=i18n-controller.js.map