Translations at Scale
type TranslationSourceLocator = {
assetsPath?: string;
locator: string;
};
type TranslationSource = string;
/**
* Use this function to provide locators for translation sources in your project
* If you only have a single source, this function is not needed. Application source is provided by default.
* We assume that your application translation files are located in `public/i18n/{lang}.json`
* If this is not the case, provide the source as a string with the proper format `path/${placeholder}.json`,
* see {@link languageSourcePlaceholder}
*
* Builds the translation source for the given input.
* @param source - The input source, either a string or a {@link TranslationSourceLocator} object.
* @returns The resolved translation source.
*/
declare const withTranslationSource: (source?: string | TranslationSourceLocator) => TranslationSource;
/**
* Use when providing {@link TranslateService }. Add any sources for translations
*
* It uses fetch API
* Use only with client-side rendered applications,
* if your app is rendered by the server prefer {@link useHttpMultiLoader }
*
* Example
* ```typescript
* provideTranslateService({
* //...other properties
* loader: useFetchMultiLoader(
* // do not include the host application source, this one is included by default
* withTranslationSource({ locator: 'my-lib-name' }),
* withTranslationSource({ locator: 'another-lib-name' }),
* )
* })
*
* ```
*
* @param features
* @returns
*/
declare const useFetchMultiLoader: (...features: TranslationSource[]) => FactoryProvider;
/**
* Use when providing {@link TranslateService }. Add any sources for translations
*
* It uses httpBackend
* If you prefer using fetch API use {@link useFetchMultiLoader }
*
* Example
* ```typescript
* provideTranslateService({
* //...other properties
* provideHttpClient(),
* loader: useHttpMultiLoader(
* // do not include the host application source, this one is included by default
* withTranslationSource({ locator: 'my-lib-name' }),
* withTranslationSource({ locator: 'another-lib-name' }),
* )
* })
*
* ```
*
* @param features
* @returns
*/
declare const useHttpMultiLoader: (...features: TranslationSource[]) => FactoryProvider;
/**
* Use this function to generate tags in your components,
* @param path the path to the tags. Ideally unique accross classes in your project
* @param keys ideintifiers for translation tags inside the path
* @returns
*/
declare const tagFactory: <K extends string, T extends string>(
path: K,
keys: T[]
) => {
path: K;
keys: T[];
tags: Record<T, string>;
};
/**
* Helper to extract a tag from an index, Useful to reduce boilerplate inside loops
* Relies on how keys are declared in the factory
* If the index is out of bounds it will return an empty string;
*
* @param translations a translation object generated by {@link tagFactory}
* @param index
* @returns
*/
declare const tagAtIndex: <T extends ReturnType<typeof tagFactory>>(translations: T, index: number) => string;
/**
* Helper to extract a slice of tags.
* Useful to reduce boilerplate or create derived objects from the main tags
*
* Relies on how keys are declared in the factory
*
* @param translations a translation object generated by {@link tagFactory}
* @param start
* @param end optional
* @returns
*/
declare const tagsAtRange: <T extends ReturnType<typeof tagFactory>>(translations: T, start: number, end?: number) => string[];
/**
* builds a translation path for a component,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the component name in camel case without the `component` suffix, i.e. `HomeComponent`-> `"home"`
*/
declare const componentPath: <P extends string, K extends string>(project: P, path: K) => `${P}.components.${K}`;
/**
* builds a translation path for a service,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the service name in camel case without the `service` suffix, i.e. `UserService`-> "user"
*/
declare const servicePath: <P extends string, K extends string>(project: P, path: K) => `${P}.services.${K}`;
/**
* builds a translation path for a directive,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the directive name in camel case without the `directive` suffix, i.e. `HighlightDirective`-> "highlight"
*/
declare const directivePath: <P extends string, K extends string>(project: P, path: K) => `${P}.directives.${K}`;
/**
* builds a translation path for a pipe,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the pipe name in camel case without the `pipe` suffix, i.e. `DatePipe`-> "date"
*/
declare const pipePath: <P extends string, K extends string>(project: P, path: K) => `${P}.pipes.${K}`;
/**
* builds a translation path for a resolver,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the resolver name in camel case without the `resolver` suffix, i.e. `UserResolver`-> "user"
*/
declare const resolverPath: <P extends string, K extends string>(project: P, path: K) => `${P}.resolvers.${K}`;
/**
* builds a translation path for a guard,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the guard name in camel case without the `guard` suffix, i.e. `AuthGuard`-> "auth"
*/
declare const guardPath: <P extends string, K extends string>(project: P, path: K) => `${P}.guards.${K}`;
/**
* builds a translation path for a store,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the store name in camel case without the `store` suffix, i.e. `UserStore`-> "user"
*/
declare const storePath: <P extends string, K extends string>(project: P, path: K) => `${P}.stores.${K}`;
/**
* builds a translation path for a route,
* (Assumes you're using the default pattern for files in this library)
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the route name in camel case, i.e. `userProfile`-> "userProfile"
*/
declare const routePath: <P extends string, K extends string>(project: P, path: K) => `${P}.routes.${K}`;
/**
* builds a custom translation path, for the cases where you do not follow
* the standard pattern,
*
* @param project the project identifier, usually the project name in camelCase `myAwesomeLib`
* @param path the route name in camel case, i.e. `userProfile`-> "userProfile"
*/
declare const customPath: <P extends string, C extends string, K extends string>(project: P, customPath: C, path: K) => `${P}.${C}.${K}`;
/**
* Use this function to generate a key for libraries that only expose a single component
* which has the same name as the library. Particularly useful on complex projects where
* components are isolated on their own libraries, most projects don't need it
*
* @param path
*/
declare const singletonPath: <P extends string>(path: P) => `${P}.components.${P}`;
/**
* Factory function to generate translation path helpers for various Angular entities.
*
* @param project The project identifier, usually the project name in camelCase (e.g., `myAwesomeLib`).
* @returns An object with methods to generate translation paths for components, services, directives, pipes, resolvers, guards, stores, routes, and custom/singleton cases.
*
* Example usage:
* ```typescript
* const paths = pathFactory('myLib');
* paths.component('home'); // 'myLib.components.home'
* paths.service('user'); // 'myLib.services.user'
* ```
*/
declare const pathFactory: <P extends string>(
project: P
) => {
component: <K extends string>(componentName: K) => `${P}.components.${K}`;
service: <K extends string>(serviceName: K) => `${P}.services.${K}`;
directive: <K extends string>(directiveName: K) => `${P}.directives.${K}`;
pipe: <K extends string>(pipeName: K) => `${P}.pipes.${K}`;
resolver: <K extends string>(resolverName: K) => `${P}.resolvers.${K}`;
guard: <K extends string>(guardName: K) => `${P}.guards.${K}`;
store: <K extends string>(storeName: K) => `${P}.stores.${K}`;
route: <K extends string>(routeName: K) => `${P}.routes.${K}`;
};
declare const languageSourcePlaceholder = "";