@alma-oss/spirit-web-react 4.5.0 → 4.6.1

package/CHANGELOG.md

@@ -3,6 +3,51 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.6.1](https://github.com/alma-oss/spirit-design-system/compare/@alma-oss/spirit-web-react@4.6.0...@alma-oss/spirit-web-react@4.6.1) (2026-05-18)
+
+### Bug Fixes
+
+- **web-react:** fix type for containerProps #DS-2561, closes [#DS-2561](https://github.com/alma-oss/spirit-design-system/issues/DS-2561)
+
+## [4.6.0](https://github.com/alma-oss/spirit-design-system/compare/@alma-oss/spirit-web-react@4.5.0...@alma-oss/spirit-web-react@4.6.0) (2026-05-15)
+
+### Features
+
+- **web-react:** add `I18nProvider` and merged translations #DS-2210, closes [#DS-2210](https://github.com/alma-oss/spirit-design-system/issues/DS-2210)
+- **web-react:** add Picker examples #DS-2504, closes [#DS-2504](https://github.com/alma-oss/spirit-design-system/issues/DS-2504)
+- **web-react:** introduce CardArticle in Figma Code Connect #DS-2406, closes [#DS-2406](https://github.com/alma-oss/spirit-design-system/issues/DS-2406)
+- **web-react:** introduce unstable Table component
+- **web-react:** replace px with rem #DS-2392, closes [#DS-2392](https://github.com/alma-oss/spirit-design-system/issues/DS-2392)
+
+### Bug Fixes
+
+- **web-react:** add disabled class for ControlButton when UNSTABLE_File is disabled
+- **web-react:** export ToastContext
+- **web-react:** extend Table demos to cover all web demos
+- **web-react:** fix invalid Figma Code Connect for various components
+- **web-react:** switch specificity of style utilities and escape hatches, closes [#DS-2234](https://github.com/alma-oss/spirit-design-system/issues/DS-2234)
+
+### Documentation
+
+- **web-react:** add missing files and directories to component's file hierarchy
+- **web-react:** introduce composition for Card article #DS-2406, closes [#DS-2406](https://github.com/alma-oss/spirit-design-system/issues/DS-2406)
+- **web-react:** make Accordion renderable in docsite preview, closes [#DS-2222](https://github.com/alma-oss/spirit-design-system/issues/DS-2222)
+- **web-react:** make all components renderable in docsite preview
+- **web-react:** pilot move of figma connection to stories
+
+### Chores
+
+- **repo:** enforce empty line before expect groups in tests
+
+### Styles
+
+- **web-react:** unify the notation for classes in style props hooks
+
+### Code Refactoring
+
+- **web-react:** remove TransferProps from components
+- **web-react:** rename defaultLabels to defaultTranslations #DS-2210, closes [#DS-2210](https://github.com/alma-oss/spirit-design-system/issues/DS-2210)
+
 ## [4.5.0](https://github.com/alma-oss/spirit-design-system/compare/@alma-oss/spirit-web-react@4.4.2...@alma-oss/spirit-web-react@4.5.0) (2026-04-13)
 
 ### Features

package/README.md

@@ -10,6 +10,7 @@
 
 - [Install](#install)
 - [Usage](#usage)
+- [Translations](#translations)
 - [Additional Attributes](#additional-attributes)
 - [Testing](#testing)
 - [Styling](#styling)
@@ -195,6 +196,64 @@ const MyComponent = () => {
 };
 ```
 
+## Translations
+
+Components ship with built-in English defaults. To override copy, wrap your app or a subtree with **`I18nProvider`**.
+You can pass either:
+
+- partial nested **`translations`** (same nested shape as library defaults), or
+- a locale catalog with **`locale`** + locale-keyed translations (`translations[locale]`).
+
+Missing keys always fall back to built-in defaults.
+
+```tsx
+import { I18nProvider } from '@alma-oss/spirit-web-react';
+
+function App() {
+  return (
+    <I18nProvider translations={{ common: { close: 'Zavřít' } }}>
+      <YourApp />
+    </I18nProvider>
+  );
+}
+```
+
+```tsx
+import { I18nProvider } from '@alma-oss/spirit-web-react';
+
+const translations = {
+  en: { common: { close: 'Close' } },
+  cs: { common: { close: 'Zavřít' } },
+};
+
+function App() {
+  return (
+    <I18nProvider locale="cs" translations={translations}>
+      <YourApp />
+    </I18nProvider>
+  );
+}
+```
+
+In client components, use **`useI18n`** to resolve strings. Without `I18nProvider`, `t` uses the built-in defaults only.
+
+```tsx
+import { useI18n } from '@alma-oss/spirit-web-react';
+
+const { t } = useI18n();
+
+t('common.close'); // 'Close'
+t('unknown.key'); // 'unknown.key' (returns the key when not found)
+```
+
+### Placeholders
+
+The `t` function accepts an optional second argument **`params`**: an object whose keys match `{key}` placeholders in the resolved string.
+
+```tsx
+t('textArea.counter.charactersEntered', { count: 42 });
+```
+
 ## Additional Attributes
 
 All components accept additional attributes that are passed down to the root element of the component.