langsys-js-react 0.6.4 → 0.6.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +14 -7
  3. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## 0.6.6 - 2026-08-16
2
+
3
+ ### Changed
4
+
5
+ - **Base SDK bumped to `langsys-js-typescript@^0.6.5`** — adds a debug-mode warning when a locale tag isn't valid BCP 47. Relevant here because the locale you set via `useLocaleStore` / `createLocaleStore` is exactly what reaches that check. `canonicalizeLocale` still falls back to best-effort casing rather than throwing, so behavior and return values are unchanged and it's silent in production — but a typo'd tag (`'en-USA'`, `'eng'`) previously degraded to a failed catalog lookup that renders base language, which is indistinguishable from a locale that simply has no translations yet. The warning fires where that distinction still exists.
6
+
7
+ ### Docs
8
+
9
+ - **README shields standardized** under the H1, matching the other Langsys SDKs. Two defects in the previous block are fixed: the license badge queried `npm/l/all-contributors` — a *different package's* license, which rendered "MIT" correctly while reporting someone else's — and four of five badges had empty link targets that navigated nowhere. Both were invisible to inspection, since a badge is checked by looking at it and neither the wrong query nor the dead link changes how the row looks.
10
+
11
+ ## 0.6.5 - 2026-08-16
12
+
13
+ ### Fixed (documentation)
14
+
15
+ - **`<Translate>`'s attribute-harvesting docs were wrong in two ways.** No behavior change — the SDK always did the right thing; the README under-described it. Verified against the published `langsys-js-typescript@0.6.4` bundle.
16
+ - **The attribute list named 4 of the 15 harvested.** Missing were `label`, four more ARIA strings (`aria-placeholder`, `aria-description`, `aria-valuetext`, `aria-roledescription`), and six `data-*` validation messages. The ARIA omissions mattered most: those strings are invisible on the page, so nobody notices they *are* translated — or would notice if they weren't.
17
+ - **"button/input `value`" over-promised.** `value` is translated on `<button>` and on `<input type="submit">` / `<input type="button">` — and no other input type. The exclusion is deliberate: `value` is translated where it's a *label* and left alone where it's *data*, so a text field's value is never rewritten. The old wording implied the SDK would mangle what a user typed.
18
+
19
+ The line was inherited from a shared ancestor by all three framework bindings; Svelte and Vue fixed theirs before publishing, and the Vue agent flagged that this package had shipped it.
20
+
1
21
  ## 0.6.4 - 2026-08-16
2
22
 
3
23
  ### Fixed
package/README.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # Langsys SDK - React
2
2
 
3
+ [![npm](https://img.shields.io/npm/v/langsys-js-react.svg?style=flat)](https://www.npmjs.com/package/langsys-js-react)
4
+ [![build](https://img.shields.io/github/actions/workflow/status/langsys/langsys-js-react/ci.yml?style=flat)](https://github.com/langsys/langsys-js-react/actions)
5
+ [![last commit](https://img.shields.io/github/last-commit/langsys/langsys-js-react.svg?style=flat)](https://github.com/langsys/langsys-js-react/commits)
6
+ [![commit activity](https://img.shields.io/github/commit-activity/m/langsys/langsys-js-react.svg?style=flat)](https://github.com/langsys/langsys-js-react/pulse)
7
+ [![bundle size](https://img.shields.io/bundlejs/size/langsys-js-react?style=flat)](https://bundlejs.com/?q=langsys-js-react)
8
+ [![types](https://img.shields.io/npm/types/langsys-js-react.svg?style=flat)](https://www.npmjs.com/package/langsys-js-react)
9
+ [![downloads](https://img.shields.io/npm/dm/langsys-js-react.svg?style=flat)](https://www.npmjs.com/package/langsys-js-react)
10
+ [![license](https://img.shields.io/npm/l/langsys-js-react.svg?style=flat)](./LICENSE)
11
+
3
12
  Langsys revolutionizes localization for apps with easy to integrate, realtime, continuous translations. Read more about Langsys Translation Manager [at the website](https://Langsys.dev/).
4
13
 
5
14
  Integrate the Langsys Translation Manager into your React, Next.js, Remix, or Vite applications using this SDK.
@@ -8,12 +17,6 @@ Integrate the Langsys Translation Manager into your React, Next.js, Remix, or Vi
8
17
 
9
18
  - **React 18 or 19** (the reactive layer is built on `useSyncExternalStore`).
10
19
 
11
- [![GitHub Release](https://img.shields.io/github/release/langsys/langsys-js-react.svg?style=flat)]()
12
- [![GitHub last commit](https://img.shields.io/github/last-commit/langsys/langsys-js-react.svg?style=flat)]()
13
- [![GitHub pull requests](https://img.shields.io/github/issues-pr/langsys/langsys-js-react.svg?style=flat)]()
14
- [![PR's Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat)](http://makeapullrequest.com)
15
- [![NPM License](https://img.shields.io/npm/l/all-contributors.svg?style=flat)](https://github.com/langsys/langsys-js-react/blob/main/LICENSE)
16
-
17
20
  ## How it's layered
18
21
 
19
22
  `langsys-js-react` is a thin React binding over the framework-agnostic [`langsys-js-typescript`](https://github.com/langsys/langsys-js-typescript) package — which owns the API client, translation lifecycle, token discovery, DOM tokenizer, and SSR-aware token strategies. This package adds only the React-native concerns:
@@ -174,7 +177,11 @@ function Article() {
174
177
  ```
175
178
 
176
179
  The component:
177
- - Recursively tokenizes text nodes and translatable attributes (`placeholder`, `alt`, `title`, `aria-label`, plus button/input `value` attributes and `<option>` text).
180
+ - Recursively tokenizes text nodes, `<option>` text, and translatable attributes — 15 of them, not just the visible ones:
181
+ - **Visible text:** `placeholder`, `alt`, `title`, `label`
182
+ - **Screen-reader text:** `aria-label`, `aria-placeholder`, `aria-description`, `aria-valuetext`, `aria-roledescription` — worth knowing these are covered, since untranslated ARIA strings are invisible on the page and only surface to someone using a screen reader
183
+ - **Validation messages:** `data-error`, `data-error-message`, `data-validation-message`, `data-invalid-message`, `data-required-message`, `data-pattern-message`
184
+ - Translates the `value` attribute **only where it is a label rather than data**: on `<button>`, and on `<input type="submit">` / `<input type="button">`. Every other input type is left alone, so a text field's value is never rewritten. This is a separate mechanism from the attribute list above — `value` is deliberately *not* in the SDK's `TRANSLATABLE_ATTRIBUTES`; it's gated by `VALUE_TRANSLATABLE_ELEMENTS` / `VALUE_TRANSLATABLE_INPUT_TYPES`.
178
185
  - Captures semantic CSS so translators see the styled appearance in the Translation Manager.
179
186
  - Registers the whole thing as a **content block** that translators handle as one unit while still translating the individual phrases inside.
180
187
  - Auto re-translates on locale change.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "langsys-js-react",
3
- "version": "0.6.4",
3
+ "version": "0.6.6",
4
4
  "description": "React binding for the Langsys translation SDK — realtime continuous translations with automatic token discovery, delivered as hooks and a <Translate> component.",
5
5
  "author": "Langsys",
6
6
  "license": "MIT",
@@ -61,7 +61,7 @@
61
61
  "react": "^18.0.0 || ^19.0.0"
62
62
  },
63
63
  "dependencies": {
64
- "langsys-js-typescript": "^0.6.4"
64
+ "langsys-js-typescript": "^0.6.5"
65
65
  },
66
66
  "devDependencies": {
67
67
  "@eslint/js": "^9.0.0",