Skip to content

Internationalization API ​

ts
import { MediaI18n, MediaText, registerI18n } from 'videojs-vue/i18n'

This optional entry uses the Video.js translation registry. See the internationalization guide for setup and locale packs.

MediaI18n ​

Renders media-i18n and applies a locale to descendant players and controls.

PropTypeDefaultDescription
langstringUnsetLocale tag; inherits the nearest ancestor language when omitted.
dir'ltr' | 'rtl' | 'auto'UnsetExplicit text direction override.

The default slot contains players, composed controls, or application content. Attributes and listeners target the underlying custom element. No scoped slot props or Vue-specific events are defined.

Language changes are reactive and do not remount players. Nested providers override their region. Locale inheritance follows the DOM hierarchy, including the destination of teleported content.

MediaText ​

Renders media-text for translated custom control text.

PropTypeDefaultDescription
tokenstringUnsetTranslation token to resolve.

The default slot supplies a plain-text English fallback. Keep icons, markup, and components outside it. A missing token or translation displays the fallback. Token, fallback, locale, and registry changes update the rendered text.

Attributes and listeners target the text element. The wrapper recreates that element when fallback text changes, because upstream captures the fallback on connection.

Registry exports ​

These functions are re-exported directly from @videojs/html/i18n; their types and behavior follow the installed upstream version.

ExportPurpose
registerI18nRegister or merge translations for a locale.
getI18nTranslationsRead registered translations with parent-locale fallback.
hasRegisteredLocaleCheck whether a locale has registered translations.
onI18nRegistryChangeSubscribe to registry changes; returns an unsubscribe function.

The entry also exports the upstream Translations, FlatTranslations, and Locale types.

Preload the full locale pack before registering partial overrides. Registering a locale yourself prevents its automatic pack loading. Call the unsubscribe function when a registry subscription is no longer needed.

Server rendering ​

The entry is safe to import on the server. It renders locale attributes and fallback text; translation runs in the browser. The registry is shared, not request-scoped. Use stable application translations and the same initial locale on server and client.