Skip to content

feat(packages): add html i18n layer and shared dom locale helpers#1554

Closed
sampotts wants to merge 10 commits into
feat/i18n-react-layerfrom
feat/i18n-html-layer
Closed

feat(packages): add html i18n layer and shared dom locale helpers#1554
sampotts wants to merge 10 commits into
feat/i18n-react-layerfrom
feat/i18n-html-layer

Conversation

@sampotts
Copy link
Copy Markdown
Collaborator

@sampotts sampotts commented May 18, 2026

Summary

  • Adds a Lit/Web Components i18n stack on @videojs/html (createI18n, provider/text mixins, elements, caption selection helper) with ./i18n and ./i18n/locales/* package exports.
  • Moves nearestLang, subscribeAmbientLang, mergeLocaleOverlays, and effectiveLocale into @videojs/utils/dom with tests, and switches React createI18n to use those helpers.
  • Switches @videojs/core and @videojs/react locale subpath exports to ./i18n/locales/* so additional locale bundles do not need new export lines.

Stack: targets feat/i18n-react-layer (React createI18n / ambient locale). Merge that PR before this one.

Test plan

  • pnpm -F @videojs/utils test src/dom/tests
  • pnpm -F @videojs/html test src/i18n/tests/create-i18n-html.test.ts
  • pnpm -F @videojs/react test (or targeted i18n tests if present)
  • pnpm typecheck

Made with Cursor


Note

Medium Risk
Adds new i18n runtime plumbing (custom elements/context providers, async locale overlay loading, and new public exports), which can affect translation resolution and bundling/tree-shaking behavior across packages. Changes are localized but touch cross-package utilities and export maps, so misconfiguration could break imports or locale updates.

Overview
Adds a new @videojs/html i18n entrypoint (./i18n) that auto-registers <media-i18n-provider> and <media-text>, plus a createI18n() factory that provides Lit context, controller, and mixins with support for ambient lang inheritance and async built-in locale overlays.

Extends @videojs/html build+package exports to ship ./i18n and ./i18n/locales/* (and marks the i18n index as a side-effectful module), and re-exports the i18n API from @videojs/html root.

Moves/centralizes DOM locale utilities into @videojs/utils/dom (effectiveLocale, nearestLang, subscribeAmbientLang, mergeLocaleOverlays, localeFromDomLang) with tests, and updates React i18n to consume these helpers while widening React locale exports to ./i18n/locales/* and adjusting its build entries accordingly.

Reviewed by Cursor Bugbot for commit b5f1f0a. Bugbot is set up for automated code reviews on this repo. Configure here.

Comment thread packages/html/src/i18n/create-i18n.ts
Comment thread packages/html/src/i18n/create-i18n.ts Outdated
Comment thread packages/html/package.json
@sampotts sampotts force-pushed the feat/i18n-html-layer branch from 36676d0 to 2fe8cc8 Compare May 18, 2026 03:56
@vercel
Copy link
Copy Markdown

vercel Bot commented May 18, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
v10-sandbox Ready Ready Preview, Comment May 22, 2026 2:13am

Request Review

Comment thread packages/react/src/i18n/create-i18n.tsx
Comment thread packages/html/src/i18n/index.ts Outdated
Comment thread packages/html/src/i18n/create-i18n.ts
Comment thread packages/html/src/i18n/index.ts Outdated
@sampotts sampotts changed the title feat(packages): add html i18n layer and shared dom locale helpers feat(packages): add html/react i18n layers and shared dom locale helpers May 19, 2026
@sampotts sampotts changed the title feat(packages): add html/react i18n layers and shared dom locale helpers feat(packages): add html i18n layer and shared dom locale helpers May 19, 2026
@sampotts sampotts force-pushed the feat/i18n-html-layer branch from d45a4c8 to 3e63671 Compare May 20, 2026 03:31
@sampotts sampotts force-pushed the feat/i18n-react-layer branch from b592706 to 35332be Compare May 20, 2026 03:31
Comment thread packages/html/src/i18n/select-captions-by-locale.ts Outdated
Comment thread packages/html/package.json
Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 4fa50a2. Configure here.

Comment thread packages/html/package.json Outdated
sampotts and others added 7 commits May 22, 2026 12:02
Centralize ambient lang, locale lookup chain merge, and effective locale in
@videojs/utils/dom so React and the new Lit provider reuse the same behavior.
Wire @videojs/html i18n subpath exports and wildcard locale packs on core/react.

Co-authored-by: Cursor <cursoragent@cursor.com>
Track the locale that started a builtin merge so the first willUpdate can
discard stale async results when lang changes before paint. Move media-i18n
element safeDefine to define/i18n so @videojs/html barrel stays side-effect free.

Co-authored-by: Cursor <cursoragent@cursor.com>
Clear stale builtin overlays when resolved locale changes before first
paint, prefer regional caption tracks over generic language siblings, and
document i18n define side effects for bundlers.

Co-authored-by: Cursor <cursoragent@cursor.com>
Replace locales/en/index.ts with flat en.ts in html and react, fix
react package export paths to *.d.ts, and add explicit react tsdown
locale entries ahead of the locale-packs PR.

Co-authored-by: Cursor <cursoragent@cursor.com>
When walking localeLookupChain, match an exact track language before any
tag.startsWith fallback so generic fr is not chosen over fr-FR on fr-fr.

Co-authored-by: Cursor <cursoragent@cursor.com>
The ./i18n API export shadows the catch-all wildcard, so consumers need an
explicit ./define/i18n entry to side-effect register i18n custom elements.

Co-authored-by: Cursor <cursoragent@cursor.com>
The define glob already marks define/i18n.js as side-effectful for bundlers.

Co-authored-by: Cursor <cursoragent@cursor.com>
Caption track matching is deferred per the i18n design doc; the html
i18n provider only handles UI string translation.

Co-authored-by: Cursor <cursoragent@cursor.com>
Align with repo convention: create-i18n.test.ts beside create-i18n.ts.

Co-authored-by: Cursor <cursoragent@cursor.com>
Register custom elements from @videojs/html/i18n per the design doc instead
of a separate define subpath; remove stale src/i18n clean globs.

Co-authored-by: Cursor <cursoragent@cursor.com>
@sampotts
Copy link
Copy Markdown
Collaborator Author

Consolidating i18n work into a single feature branch (feat/i18n) until the feature is complete. This stacked PR is closed; we will reopen as a fresh split review stack from feat/i18n when ready for review.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

1 participant