@wads.dev/i18n-html

Typed DOM bindings and static HTML usage discovery for catalogs built with @wads.dev/i18n-ts.

Status: 0.0.1-alpha.0. The API may change before 1.0.0.

Install

npm install @wads.dev/i18n-ts@alpha @wads.dev/i18n-html@alpha

Translate a document

Use data-i18n for element text and data-i18n-{attribute} for attributes.

<h1 data-i18n="page.title">Loading…</h1>
<input data-i18n-placeholder="search.placeholder" placeholder="Loading…">

import { translateHtml } from '@wads.dev/i18n-html'

translateHtml(document, Lang)

translateHtml is explicit. It does not watch the DOM or keep its own language state; call it after loading or changing the language.

Discover static HTML usage

Tooling can recognize the same contract through the Node-only entry point:

import { collectHtmlI18nReferences } from '@wads.dev/i18n-html/usage'

const references = collectHtmlI18nReferences({
  directory: process.cwd(),
  ignoredDirectories: ['src/i18n'],
})

Each reference contains the translation key plus the relative file, line and column.

Ecosystem

• @wads.dev/i18n-ts: typed contracts, language loading, bundles and configuration.
• @wads.dev/i18n-react: React adapter.
• @wads.dev/i18n-html: DOM/HTML adapter.
• @wads.dev/i18n-editor: local bundle editor and project exporter.