Localization, SEO, and assets API
Localization state and routing, document head, SEO metadata, images, fonts, scripts, and style registries.
Localization, SEO, and assets exports
44 public exports, grouped under their canonical import boundary.
@tavojs/core
Canonical import boundary for every symbol in this section.
AnyI18nService#
type AnyI18nService = I18nService<any, string>;Defines the any i18n service contract used by the application runtime.
Related guidecreateI18n#
createI18n<TMessages extends I18nMessages, TDefaultLocale extends keyof TMessages & string>(options: CreateI18nOptions<TMessages, TDefaultLocale>): I18nService<TMessages, TDefaultLocale>Creates a reactive i18n service with direct object access through `i18n.text`.
Related guideCreateI18nOptions#
type CreateI18nOptions<TMessages extends I18nMessages, TDefaultLocale extends keyof TMessages & string> = {
defaultLocale: TDefaultLocale;
locale?: keyof TMessages & string;
fallbackLocale?: keyof TMessages & string;
messages: TMessages;
locales?: Partial<Record<keyof TMessages & string, I18nLocaleInfo>>;
routing?: false | I18nRoutingOptions;
serviceName?: string | false;
onMissingKey?: (payload: I18nMissingKeyPayload) => string | void;
};Configures create i18n in the application runtime.
Related guidecreateStyleRegistry#
createStyleRegistry(): StyleRegistryCreates style registry for the application runtime.
Related guideDEFAULT_I18N_SERVICE_NAME#
DEFAULT_I18N_SERVICE_NAME: "tavo:i18n"Exposes the default i18 n service name constant used by the application runtime.
Related guideDefinedI18nMessages#
type DefinedI18nMessages<TMessages extends I18nMessages> = TMessages & {
readonly __tavo_defined_messages__?: true;
};Defines the defined i18n messages contract used by the application runtime.
Related guidedefineMessages#
defineMessages<const TMessages extends I18nMessages>(messages: TMessages): DefinedI18nMessages<TMessages>Marks a central translation catalog for build-time i18n splitting.
Related guideensureClientStyle#
ensureClientStyle(id: string, css: string, options?: StyleOptions | undefined): voidEnsures client style for the application runtime.
Related guideFont#
Font(props: FontProps): ChildLoads external or self-hosted fonts into the document head for SSR and CSR usage.
Related guideFontDisplay#
type FontDisplay = "auto" | "block" | "swap" | "fallback" | "optional";Defines the font display contract used by the application runtime.
Related guideFontProps#
type FontProps = {
href?: string;
src?: string;
family?: string;
local?: string[];
weight?: string | number;
style?: "normal" | "italic" | "oblique";
display?: FontDisplay;
preload?: boolean;
preconnect?: string[];
crossOrigin?: "anonymous" | "use-credentials";
type?: string;
variable?: `--${string}`;
fallback?: string;
};Defines the props accepted by font in the application runtime.
Related guidegetActiveStyleRegistry#
getActiveStyleRegistry(): StyleRegistry | nullReads active style registry for the application runtime.
Related guideHead#
Head(props: PropsWithChildren<HeadProps>): ChildProvides head behavior for the application runtime.
Related guideHeadProps#
type HeadProps = {
title?: string;
unsafeHeadHtml?: string;
children?: Child;
};Defines the props accepted by head in the application runtime.
Related guideI18nDetectLocaleInput#
type I18nDetectLocaleInput = {
pathname?: string;
request?: unknown;
headers?: Headers | Record<string, string | string[] | undefined>;
cookie?: string;
};Defines the i18n detect locale input contract used by the application runtime.
Related guideI18nLocaleDirection#
type I18nLocaleDirection = "ltr" | "rtl" | "auto";Defines the i18n locale direction contract used by the application runtime.
Related guideI18nLocaleInfo#
type I18nLocaleInfo = {
label?: string;
dir?: I18nLocaleDirection;
};Defines the i18n locale info contract used by the application runtime.
Related guideI18nMessages#
type I18nMessages = Record<string, I18nTextTree>;Defines the i18n messages contract used by the application runtime.
Related guideI18nMissingKeyPayload#
type I18nMissingKeyPayload = {
key: string;
locale: string;
fallbackLocale: string;
};Defines the i18n missing key payload contract used by the application runtime.
Related guideI18nParams#
type I18nParams = Record<string, string | number | boolean | null | undefined>;Defines the i18n params contract used by the application runtime.
Related guideI18nPrimitive#
type I18nPrimitive = string | number | boolean | null;Defines the i18n primitive contract used by the application runtime.
Related guideI18nResolvedPath#
type I18nResolvedPath<TLocale extends string = string> = {
pathname: string;
locale: TLocale;
localized: boolean;
};Defines the i18n resolved path contract used by the application runtime.
Related guideI18nRoutingOptions#
type I18nRoutingOptions = {
enabled?: boolean;
defaultLocalePrefix?: "always" | "never";
cookieName?: string;
detectFrom?: Array<"path" | "cookie" | "header">;
};Configures i18n routing in the application runtime.
Related guideI18nService#
type I18nService<TMessages extends I18nMessages, TDefaultLocale extends keyof TMessages & string> = {
readonly locale: keyof TMessages & string;
readonly defaultLocale: TDefaultLocale;
readonly fallbackLocale: keyof TMessages & string;
readonly locales: Array<keyof TMessages & string>;
readonly dir: I18nLocaleDirection;
readonly messages: TMessages;
readonly text: TMessages[TDefaultLocale];
readonly store: Store<I18nState<TMessages>>;
setLocale(locale: keyof TMessages & string, options?: I18nSetLocaleOptions): I18nState<TMessages>;
setMessages(locale: keyof TMessages & string, messages: TMessages[keyof TMessages], options?: {
merge?: boolean;
}): I18nState<TMessages>;
getLocaleInfo(locale?: keyof TMessages & string): I18nLocaleInfo;
detectLocale(input?: I18nDetectLocaleInput): keyof TMessages & string;
resolvePath(pathname: string): I18nResolvedPath<keyof TMessages & string>;
localizePath(pathname: string, locale?: keyof TMessages & string, options?: {
includeDefaultLocale?: boolean;
}): string;
setLocaleFromRequest(input?: I18nDetectLocaleInput): I18nState<TMessages>;
setLocaleFromPath(pathname: string): I18nState<TMessages>;
t(key: I18nTranslationKey<TMessages[TDefaultLocale]>, params?: I18nParams): string;
t(key: string, params?: I18nParams): string;
subscribe(listener: StoreListener<I18nState<TMessages>>, options?: {
immediate?: boolean;
}): Unsubscribe;
watchLocale(listener: StoreWatchListener<keyof TMessages & string, I18nState<TMessages>>, options?: {
immediate?: boolean;
}): Unsubscribe;
};Defines the i18n service contract used by the application runtime.
Related guideI18nSetLocaleOptions#
type I18nSetLocaleOptions = {
persist?: boolean;
};Configures i18n set locale in the application runtime.
Related guideI18nState#
type I18nState<TMessages extends I18nMessages> = {
locale: keyof TMessages & string;
fallbackLocale: keyof TMessages & string;
messages: TMessages;
};Represents the observable state of i18n in the application runtime.
Related guideI18nTextTree#
type I18nTextTree = {
readonly [key: string]: I18nTextValue;
};Defines the i18n text tree contract used by the application runtime.
Related guideI18nTextValue#
type I18nTextValue = I18nPrimitive | I18nTextTree | readonly I18nTextValue[];Defines the i18n text value contract used by the application runtime.
Related guideI18nTranslationKey#
type I18nTranslationKey<TTree> = TTree extends I18nTextTree ? {
[K in StringKeyOf<TTree>]: TTree[K] extends I18nTextTree ? `${K}` | `${K}.${I18nTranslationKey<TTree[K]>}` : `${K}`;
}[StringKeyOf<TTree>] : never;Defines the i18n translation key contract used by the application runtime.
Related guideImage#
Image(props: ImageProps): ChildSEO-friendly image component that emits responsive SSR optimizer URLs.
Related guideImageFormat#
type ImageFormat = "webp" | "avif" | "jpeg" | "png" | "original";Defines the image format contract used by the application runtime.
Related guideImageProps#
type ImageProps = {
src: string;
alt: string;
width?: number;
height?: number;
widths?: number[];
sizes?: string;
quality?: number;
format?: ImageFormat;
priority?: boolean;
unoptimized?: boolean;
loading?: "lazy" | "eager";
decoding?: "async" | "sync" | "auto";
fetchPriority?: "high" | "low" | "auto";
srcset?: string;
className?: ClassName;
style?: string | Record<string, unknown>;
[key: string]: unknown;
};Defines the props accepted by image in the application runtime.
Related guiderenderStyleTags#
renderStyleTags(registry: StyleRegistry, options?: RenderStyleTagsOptions | undefined): stringRenders style tags for the application runtime.
Related guideScript#
Script(props: ScriptProps): ChildInjects external or inline scripts into the document head for CSR and SSR flows.
Related guideScriptProps#
type ScriptProps = {
src?: string;
type?: string;
async?: boolean;
defer?: boolean;
module?: boolean;
noModule?: boolean;
preload?: boolean;
content?: string;
json?: unknown;
id?: string;
nonce?: string;
integrity?: string;
crossOrigin?: "anonymous" | "use-credentials";
referrerPolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url";
fetchPriority?: "high" | "low" | "auto";
};Defines the props accepted by script in the application runtime.
Related guideSeo#
Seo(props: SeoProps): ChildInjects common SEO metadata into the document head for CSR and SSR apps.
Related guideSeoOpenGraph#
type SeoOpenGraph = {
title?: string;
description?: string;
type?: string;
url?: string;
image?: string;
imageAlt?: string;
siteName?: string;
locale?: string;
};Defines the seo open graph contract used by the application runtime.
Related guideSeoProps#
type SeoProps = {
title?: string;
description?: string;
canonical?: string;
robots?: string;
noIndex?: boolean;
noFollow?: boolean;
keywords?: string | string[];
author?: string;
themeColor?: string;
openGraph?: SeoOpenGraph;
twitter?: SeoTwitter;
};Defines the props accepted by seo in the application runtime.
Related guideSeoTwitter#
type SeoTwitter = {
card?: "summary" | "summary_large_image" | "app" | "player";
title?: string;
description?: string;
image?: string;
creator?: string;
site?: string;
};Defines the seo twitter contract used by the application runtime.
Related guidestyle#
style(id: string, css: string, options?: StyleOptions | undefined): voidProvides style behavior for the application runtime.
Related guideStyleOptions#
type StyleOptions = {
attributes?: Record<string, string | number | boolean>;
};Configures style in the application runtime.
Related guideStyleRegistry#
type StyleRegistry = {
add(id: string, css: string, options?: StyleOptions): void;
has(id: string): boolean;
entries(): StyleRegistryEntry[];
};Defines the style registry contract used by the application runtime.
Related guideStyleRegistryEntry#
type StyleRegistryEntry = {
id: string;
css: string;
attributes?: Record<string, string | number | boolean>;
};Describes one entry in style registry in the application runtime.
Related guidewithStyleRegistry#
withStyleRegistry<T>(registry: StyleRegistry, fn: () => T): TRuns work with style registry for the application runtime.
Related guide