@synergy-design-system/components
Version:
60 lines (59 loc) • 2.99 kB
TypeScript
/**
* This file was forked from the original source at https://github.com/shoelace-style/localize
* Copyright (c) 2021-present the original author or authors. All rights reserved.
* Licensed under the MIT License. See LICENSE in the project root for license information.
* Modifications have been made to adapt the code for use in this project.
* Please refer to the original source for the initial implementation and any additional context.
*/
import type { ReactiveController, ReactiveControllerHost } from 'lit';
import type { DefaultTranslation, ExistsOptions, FunctionParams, Translation } from './types.js';
/** Updates all localized elements that are currently connected */
export declare function update(): void;
/** Registers one or more translations */
export declare function registerTranslation(...translation: Translation[]): void;
/**
* Localize Reactive Controller for components built with Lit
*
* To use this controller, import the class and instantiate it in a custom element constructor:
*
* private localize = new LocalizeController(this);
*
* This will add the element to the set and make it respond to changes to <html dir|lang> automatically. To make it
* respond to changes to its own dir|lang properties, make it a property:
*
* @property() dir: string;
* @property() lang: string;
*
* To use a translation method, call it like this:
*
* ${this.localize.term('term_key_here')}
* ${this.localize.date('2021-12-03')}
* ${this.localize.number(1000000)}
*/
export declare class LocalizeController<UserTranslation extends Translation = DefaultTranslation> implements ReactiveController {
host: ReactiveControllerHost & HTMLElement;
constructor(host: ReactiveControllerHost & HTMLElement);
hostConnected(): void;
hostDisconnected(): void;
/**
* Gets the host element's directionality as determined by the `dir` attribute. The return value is transformed to
* lowercase.
*/
dir(): string;
/**
* Gets the host element's language as determined by the `lang` attribute. The return value is transformed to
* lowercase.
*/
lang(): string;
private getTranslationData;
/** Determines if the specified term exists, optionally checking the fallback translation. */
exists<K extends keyof UserTranslation>(key: K, options: Partial<ExistsOptions>): boolean;
/** Outputs a translated term. */
term<K extends keyof UserTranslation>(key: K, ...args: FunctionParams<UserTranslation[K]>): string;
/** Outputs a localized date in the specified format. */
date(dateToFormat: Date | string, options?: Intl.DateTimeFormatOptions): string;
/** Outputs a localized number in the specified format. */
number(numberToFormat: number | string, options?: Intl.NumberFormatOptions): string;
/** Outputs a localized time in relative format. */
relativeTime(value: number, unit: Intl.RelativeTimeFormatUnit, options?: Intl.RelativeTimeFormatOptions): string;
}