diff --git a/.storybook/decorators/withLang.tsx b/.storybook/decorators/withLang.tsx
index 9915e97b3..87e4350f9 100644
--- a/.storybook/decorators/withLang.tsx
+++ b/.storybook/decorators/withLang.tsx
@@ -1,12 +1,12 @@
import React from 'react';
import type {Decorator} from '@storybook/react';
-import {Lang, configure} from '../../src/utils/configure';
+import {configure} from '@gravity-ui/uikit';
export const withLang: Decorator = (Story, context) => {
const lang = context.globals.lang;
configure({
- lang: lang as Lang,
+ lang: lang,
});
return ;
diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
index ca93546a3..f9a475790 100644
--- a/.storybook/preview.tsx
+++ b/.storybook/preview.tsx
@@ -12,15 +12,10 @@ import {withLang} from './decorators/withLang';
import {DocsDecorator} from './decorators/docs';
import {Theme} from '../src';
-import {configure, Lang} from '../src/utils/configure';
import {GlobalThemeController} from './theme/utils/global-theme-controller';
import '../styles/styles.scss';
-configure({
- lang: Lang.En,
-});
-
const withContextProvider: Decorator = (Story, context) => {
const theme = context.globals.theme;
diff --git a/README.md b/README.md
index 9e0301879..a1c3cf660 100644
--- a/README.md
+++ b/README.md
@@ -215,12 +215,14 @@ To add a theme to a block property:
### i18n
-To make sure the i18n library used in your project runs properly, perform its initialization and set the project's current locale value in `lang`. For example:
+The `page-constructor` is a `uikit-based` library, and we use an instance of `i18n` from uikit. To set up internationalization, you just need to use the `configure` from uikit:
```typescript
-import {configure, Lang} from '@gravity-ui/page-constructor';
+import {configure} from '@gravity-ui/uikit';
-configure({lang: Lang.En});
+configure({
+ lang: 'ru',
+});
```
### Maps
diff --git a/src/blocks/FilterBlock/FilterBlock.tsx b/src/blocks/FilterBlock/FilterBlock.tsx
index 2254ae062..d56481405 100644
--- a/src/blocks/FilterBlock/FilterBlock.tsx
+++ b/src/blocks/FilterBlock/FilterBlock.tsx
@@ -8,7 +8,7 @@ import {Col, Row} from '../../grid';
import {FilterBlockProps, FilterItem} from '../../models';
import {block, getBlockKey} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './FilterBlock.scss';
diff --git a/src/blocks/FilterBlock/i18n/index.ts b/src/blocks/FilterBlock/i18n/index.ts
index 284e72e71..0e04fb0c6 100644
--- a/src/blocks/FilterBlock/i18n/index.ts
+++ b/src/blocks/FilterBlock/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'FilterBlock';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}FilterBlock`);
diff --git a/src/blocks/Security/i18n/index.ts b/src/blocks/Security/i18n/index.ts
index ebf1ccac8..1f32e476c 100644
--- a/src/blocks/Security/i18n/index.ts
+++ b/src/blocks/Security/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'SecurityBlock';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}SecurityBlock`);
diff --git a/src/blocks/Share/Share.tsx b/src/blocks/Share/Share.tsx
index 59e01a165..b0d061cb9 100644
--- a/src/blocks/Share/Share.tsx
+++ b/src/blocks/Share/Share.tsx
@@ -12,7 +12,7 @@ import {Vk} from '../../icons/Vk';
import {DefaultEventNames, ShareBlockProps} from '../../models';
import {block, getAbsolutePath, getShareLink} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './Share.scss';
diff --git a/src/blocks/Share/i18n/index.ts b/src/blocks/Share/i18n/index.ts
index 06d5314be..15afd20e6 100644
--- a/src/blocks/Share/i18n/index.ts
+++ b/src/blocks/Share/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Share';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Share`);
diff --git a/src/blocks/Slider/Arrow/Arrow.tsx b/src/blocks/Slider/Arrow/Arrow.tsx
index ca34074b7..5afc96f5e 100644
--- a/src/blocks/Slider/Arrow/Arrow.tsx
+++ b/src/blocks/Slider/Arrow/Arrow.tsx
@@ -3,7 +3,7 @@ import React from 'react';
import ToggleArrow from '../../../components/ToggleArrow/ToggleArrow';
import {ClassNameProps} from '../../../models';
import {block} from '../../../utils';
-import i18n from '../i18n';
+import {i18n} from '../i18n';
import './Arrow.scss';
diff --git a/src/blocks/Slider/i18n/index.ts b/src/blocks/Slider/i18n/index.ts
index fd3f1a017..9f8937a05 100644
--- a/src/blocks/Slider/i18n/index.ts
+++ b/src/blocks/Slider/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'SliderBlock';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}SliderBlock`);
diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
index a2915403f..502f7ff9a 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/Button.tsx
@@ -10,7 +10,7 @@ import {Github} from '../../icons';
import {ButtonProps as ButtonParams, DefaultEventNames, QAProps} from '../../models';
import {block, setUrlTld} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import {ICON_QA, OldButtonSize, OldButtonTheme, toCommonSize, toCommonView} from './utils';
import './Button.scss';
diff --git a/src/components/Button/i18n/index.ts b/src/components/Button/i18n/index.ts
index 1d91df459..5763bb907 100644
--- a/src/components/Button/i18n/index.ts
+++ b/src/components/Button/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Button';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Button`);
diff --git a/src/components/Control/Control.tsx b/src/components/Control/Control.tsx
index 750165f5c..526b59c04 100644
--- a/src/components/Control/Control.tsx
+++ b/src/components/Control/Control.tsx
@@ -5,7 +5,7 @@ import {SVGIconData} from '@gravity-ui/uikit/build/esm/components/Icon/types';
import {block} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './Control.scss';
diff --git a/src/components/Control/i18n/index.ts b/src/components/Control/i18n/index.ts
index ced20aa9e..7fc150fcf 100644
--- a/src/components/Control/i18n/index.ts
+++ b/src/components/Control/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Control';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Control`);
diff --git a/src/components/FullscreenImage/FullscreenImage.tsx b/src/components/FullscreenImage/FullscreenImage.tsx
index 33e73023c..d0bceac55 100644
--- a/src/components/FullscreenImage/FullscreenImage.tsx
+++ b/src/components/FullscreenImage/FullscreenImage.tsx
@@ -6,7 +6,7 @@ import {Fullscreen, PreviewClose} from '../../icons';
import {block} from '../../utils';
import Image, {ImageProps} from '../Image/Image';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './FullscreenImage.scss';
diff --git a/src/components/FullscreenImage/i18n/index.ts b/src/components/FullscreenImage/i18n/index.ts
index 76340727f..d58686213 100644
--- a/src/components/FullscreenImage/i18n/index.ts
+++ b/src/components/FullscreenImage/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'FullscreenImage';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}FullscreenImage`);
diff --git a/src/components/Map/GoogleMap.tsx b/src/components/Map/GoogleMap.tsx
index 395b6301e..d8774dbff 100644
--- a/src/components/Map/GoogleMap.tsx
+++ b/src/components/Map/GoogleMap.tsx
@@ -1,5 +1,6 @@
import React, {useContext, useEffect, useMemo, useRef, useState} from 'react';
+import {Lang} from '@gravity-ui/uikit';
import debounce from 'lodash/debounce';
import {LocaleContext} from '../../context/localeContext/localeContext';
@@ -7,7 +8,6 @@ import {MapsContext} from '../../context/mapsContext/mapsContext';
import {MobileContext} from '../../context/mobileContext';
import {GMapProps} from '../../models';
import {block} from '../../utils';
-import {Lang} from '../../utils/configure';
import {getMapHeight} from './helpers';
@@ -17,7 +17,7 @@ interface GoogleMapLinkParams {
apiKey: string;
scriptSrc: string;
address: string;
- lang: Lang;
+ lang: `${Lang}`;
zoom?: number;
}
diff --git a/src/components/Map/YMap/YandexMap.tsx b/src/components/Map/YMap/YandexMap.tsx
index 0f15afea1..43b5b3d45 100644
--- a/src/components/Map/YMap/YandexMap.tsx
+++ b/src/components/Map/YMap/YandexMap.tsx
@@ -13,7 +13,7 @@ import {getMapHeight} from '../helpers';
import {YMap} from './YMap';
import {MapApiStatus, YMapsApiLoader} from './YandexMapApiLoader';
-import i18n from './i18n';
+import {i18n} from './i18n';
const b = block('map');
const DEFAULT_CONTAINER_ID = 'ymap';
diff --git a/src/components/Map/YMap/i18n/index.ts b/src/components/Map/YMap/i18n/index.ts
index 8d8e8f822..4ad7ecd6e 100644
--- a/src/components/Map/YMap/i18n/index.ts
+++ b/src/components/Map/YMap/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Map';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Map`);
diff --git a/src/components/Media/DataLens/DataLens.tsx b/src/components/Media/DataLens/DataLens.tsx
index 5949658ba..3ad101c24 100644
--- a/src/components/Media/DataLens/DataLens.tsx
+++ b/src/components/Media/DataLens/DataLens.tsx
@@ -3,7 +3,7 @@ import React from 'react';
import {MediaComponentDataLensProps} from '../../../models';
import {block} from '../../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import {unifyDataLensToObject} from './utils';
import './DataLens.scss';
diff --git a/src/components/Media/DataLens/i18n/index.ts b/src/components/Media/DataLens/i18n/index.ts
index 0f38490e9..66b479e30 100644
--- a/src/components/Media/DataLens/i18n/index.ts
+++ b/src/components/Media/DataLens/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'DataLens';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}DataLens`);
diff --git a/src/components/Media/Iframe/Iframe.tsx b/src/components/Media/Iframe/Iframe.tsx
index 417511916..2a56f3239 100644
--- a/src/components/Media/Iframe/Iframe.tsx
+++ b/src/components/Media/Iframe/Iframe.tsx
@@ -3,7 +3,7 @@ import React from 'react';
import {MediaComponentIframeProps} from '../../../models';
import {block} from '../../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './Iframe.scss';
diff --git a/src/components/Media/Iframe/i18n/index.ts b/src/components/Media/Iframe/i18n/index.ts
index 5455a2e06..2368a7d24 100644
--- a/src/components/Media/Iframe/i18n/index.ts
+++ b/src/components/Media/Iframe/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Iframe';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Iframe`);
diff --git a/src/components/OverflowScroller/OverflowScroller.tsx b/src/components/OverflowScroller/OverflowScroller.tsx
index b24aa7e6e..851f0d20b 100644
--- a/src/components/OverflowScroller/OverflowScroller.tsx
+++ b/src/components/OverflowScroller/OverflowScroller.tsx
@@ -5,7 +5,7 @@ import debounce from 'lodash/debounce';
import {ToggleArrow} from '..';
import {block} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './OverflowScroller.scss';
diff --git a/src/components/OverflowScroller/i18n/index.ts b/src/components/OverflowScroller/i18n/index.ts
index bfb85ee6a..75575af23 100644
--- a/src/components/OverflowScroller/i18n/index.ts
+++ b/src/components/OverflowScroller/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'OverflowScroller';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}OverflowScroller`);
diff --git a/src/components/ReactPlayer/CustomBarControls.tsx b/src/components/ReactPlayer/CustomBarControls.tsx
index 1e2f51c03..04c0ae09a 100644
--- a/src/components/ReactPlayer/CustomBarControls.tsx
+++ b/src/components/ReactPlayer/CustomBarControls.tsx
@@ -9,7 +9,7 @@ import {ClassNameProps, CustomControlsOptions, CustomControlsType} from '../../m
import {block} from '../../utils';
import CircleProgress from './CircleProgress';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './CustomBarControls.scss';
diff --git a/src/components/ReactPlayer/ReactPlayer.tsx b/src/components/ReactPlayer/ReactPlayer.tsx
index 3bd06951b..0a809ff6b 100644
--- a/src/components/ReactPlayer/ReactPlayer.tsx
+++ b/src/components/ReactPlayer/ReactPlayer.tsx
@@ -35,7 +35,7 @@ import {
import {block} from '../../utils';
import CustomBarControls from './CustomBarControls';
-import i18n from './i18n';
+import {i18n} from './i18n';
import {checkYoutubeVideos} from './utils';
import './ReactPlayer.scss';
diff --git a/src/components/ReactPlayer/i18n/index.ts b/src/components/ReactPlayer/i18n/index.ts
index 8ae278fd4..5a25b2b81 100644
--- a/src/components/ReactPlayer/i18n/index.ts
+++ b/src/components/ReactPlayer/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'ReactPlayer';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}ReactPlayer`);
diff --git a/src/components/UnpublishedLabel/UnpublishedLabel.tsx b/src/components/UnpublishedLabel/UnpublishedLabel.tsx
index 70afd2ae6..3c9136a84 100644
--- a/src/components/UnpublishedLabel/UnpublishedLabel.tsx
+++ b/src/components/UnpublishedLabel/UnpublishedLabel.tsx
@@ -3,7 +3,7 @@ import React from 'react';
import {WithChildren} from '../../models';
import {block} from '../../utils';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './UnpublishedLabel.scss';
diff --git a/src/components/UnpublishedLabel/i18n/index.ts b/src/components/UnpublishedLabel/i18n/index.ts
index e020178b7..6ec22da22 100644
--- a/src/components/UnpublishedLabel/i18n/index.ts
+++ b/src/components/UnpublishedLabel/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'UnpublishedLabel';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}UnpublishedLabel`);
diff --git a/src/components/VideoBlock/VideoBlock.tsx b/src/components/VideoBlock/VideoBlock.tsx
index 8ef5ddd5f..ee498ba85 100644
--- a/src/components/VideoBlock/VideoBlock.tsx
+++ b/src/components/VideoBlock/VideoBlock.tsx
@@ -10,7 +10,7 @@ import {AnalyticsEventsBase, DefaultEventNames} from '../../models/common';
import {block, getPageSearchParams} from '../../utils';
import Image from '../Image/Image';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './VideoBlock.scss';
diff --git a/src/components/VideoBlock/i18n/index.ts b/src/components/VideoBlock/i18n/index.ts
index 2133bfb58..544ea7dda 100644
--- a/src/components/VideoBlock/i18n/index.ts
+++ b/src/components/VideoBlock/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'VideoBlock';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}VideoBlock`);
diff --git a/src/containers/Loadable/Loadable.tsx b/src/containers/Loadable/Loadable.tsx
index e11e1f942..a965e5f14 100644
--- a/src/containers/Loadable/Loadable.tsx
+++ b/src/containers/Loadable/Loadable.tsx
@@ -12,7 +12,7 @@ import {
} from '../../models';
import {block as blockCn} from '../../utils/cn';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './Loadable.scss';
diff --git a/src/containers/Loadable/i18n/index.ts b/src/containers/Loadable/i18n/index.ts
index f827cce02..cba3beabc 100644
--- a/src/containers/Loadable/i18n/index.ts
+++ b/src/containers/Loadable/i18n/index.ts
@@ -1,8 +1,8 @@
-import {registerKeyset} from '../../../utils/registerKeyset';
+import {addComponentKeysets} from '@gravity-ui/uikit/i18n';
+
+import {NAMESPACE} from '../../../utils/cn';
import en from './en.json';
import ru from './ru.json';
-const COMPONENT = 'Loadable';
-
-export default registerKeyset({en, ru}, COMPONENT);
+export const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}Loadable`);
diff --git a/src/context/localeContext/localeContext.ts b/src/context/localeContext/localeContext.ts
index 4522194fc..b4aa396eb 100644
--- a/src/context/localeContext/localeContext.ts
+++ b/src/context/localeContext/localeContext.ts
@@ -1,9 +1,9 @@
import React from 'react';
-import {Lang} from '../../utils/configure';
+import {Lang} from '@gravity-ui/uikit';
export type LocaleContextProps = {
- lang?: Lang;
+ lang?: `${Lang}`;
tld?: string;
};
diff --git a/src/editor/components/ControlPanel/ControlPanel.tsx b/src/editor/components/ControlPanel/ControlPanel.tsx
index cdbc07d8a..93a044380 100644
--- a/src/editor/components/ControlPanel/ControlPanel.tsx
+++ b/src/editor/components/ControlPanel/ControlPanel.tsx
@@ -8,7 +8,7 @@ import {block} from '../../../utils';
import {Tablet} from '../../icons/Tablet';
import {ViewModeItem} from '../../types';
-import i18n from './i18n';
+import {i18n} from './i18n';
import './ControlPanel.scss';
@@ -61,7 +61,7 @@ const ControlPanel = ({
- {i18n('Theme')}
+ {i18n('theme')}