feat(react): add i18n provider and wire UI labels#1595
Open
sampotts wants to merge 31 commits into
Open
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This was referenced May 26, 2026
This was referenced Jun 17, 2026
sampotts
force-pushed
the
feat/i18n-react
branch
from
f12eb04 to
5300bbf
Compare
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
sampotts
force-pushed
the
feat/i18n-react
branch
from
b09f18e to
1c82614
Compare
sampotts
force-pushed
the
feat/i18n-react
branch
from
1c82614 to
f429bf7
Compare
sampotts
force-pushed
the
feat/i18n-react
branch
from
f429bf7 to
27e96f0
Compare
Wrap the player Provider with I18nProvider so preset skins inherit locale and lazy locale loading, and restore English ARIA expectations in tests. Co-authored-by: Cursor <cursoragent@cursor.com>
Let outer I18nProvider (sandbox locale) win over player chrome, and skip nested default providers so locale props are not shadowed. Co-authored-by: Cursor <cursoragent@cursor.com>
Pass langRootRef from Container for ambient lang resolution, fall back to documentElement before mount, and inherit ancestor locale when a nested provider only supplies translation overrides. Co-authored-by: Cursor <cursoragent@cursor.com>
Only pass locale to I18nProviderRoot when a value is resolved so nested providers do not assign undefined under exactOptionalPropertyTypes. Co-authored-by: Cursor <cursoragent@cursor.com>
Re-check lazy-load sequence after getBrowserTranslations resolves so a superseded locale cannot register browser translations globally. Co-authored-by: Cursor <cursoragent@cursor.com>
Container's langRootRef no longer forces a nested provider that shadows an ancestor locale or translations prop. Co-authored-by: Cursor <cursoragent@cursor.com>
Track whether a provider locale came from an explicit prop so Container's langRootRef still resolves player shell lang when a test or app wrapper supplies an ambient ancestor provider. Co-authored-by: Cursor <cursoragent@cursor.com>
Adds regression tests for document.documentElement.lang updates on I18nProvider with and without langRootRef. Co-authored-by: Cursor <cursoragent@cursor.com>
Use mergeLocaleOverlays loadedTags instead of merged overlay so English-only lazy merges no longer block browser translation fallback. Co-authored-by: Cursor <cursoragent@cursor.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Refs #222
Closes #1364
Summary
I18nProvider, hooks, and wires skin control labels throughuseTranslatorContainerwith nested-provider passthrough for explicit localeslangRootRefunder ambient ancestor providersTest plan
pnpm -F @videojs/react test src/i18nStacked on #1591.
Made with Cursor
Note
Medium Risk
Touches accessibility strings across many controls and async locale loading; behavior is well tested but regressions in aria-labels or locale edge cases are possible.
Overview
Adds a React i18n layer (
createI18n, defaultI18nProvider,useTranslator,useLocale) that merges registry, lazy built-in locale packs, props, and optional browser fallbacks, with locale from props, DOMlang(vialangRootRef/ ambient subscription), and nested-provider passthrough.Containerwraps the player shell inI18nProviderwithlangRootRefso skins inherit locale without extra setup. Package exports add@videojs/react/i18nand per-locale build entries.UI controls and dialogs now resolve labels through
resolveControlLabel/resolveControlAttrsand core phrase helpers (ErrorDialogtitle/description/close, time remaining, input-indicator labels). Presets drop hard-coded error dialog copy in favor of those components. Tests cover provider behavior, play buttonaria-label, and translated error dialog.Reviewed by Cursor Bugbot for commit f12eb04. Bugbot is set up for automated code reviews on this repo. Configure here.