@gravity-ui/dashkit 4.1.0 → 5.1.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## [5.1.0](https://github.com/gravity-ui/dashkit/compare/v5.0.0...v5.1.0) (2023-02-09)
+
+
+### Features
+
+* generating a unique id for config ([#41](https://github.com/gravity-ui/dashkit/issues/41)) ([062c8d0](https://github.com/gravity-ui/dashkit/commit/062c8d015e334061fac193cf8c0a549a932e3a87))
+
+## [5.0.0](https://github.com/gravity-ui/dashkit/compare/v4.1.0...v5.0.0) (2023-02-01)
+
+
+### ⚠ BREAKING CHANGES
+
+* up @gravity-ui/uikit to 4 version ([#39](https://github.com/gravity-ui/dashkit/issues/39))
+
+### Features
+
+* up @gravity-ui/uikit to 4 version ([#39](https://github.com/gravity-ui/dashkit/issues/39)) ([8b4c123](https://github.com/gravity-ui/dashkit/commit/8b4c123a69009918518d4c296af3c315f811afd9))
+
 ## [4.1.0](https://github.com/gravity-ui/dashkit/compare/v4.0.0...v4.1.0) (2023-01-31)
 
 

package/build/cjs/components/DashKit/DashKit.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import GridLayout from '../GridLayout/GridLayout';
-import { SetConfigItem, Settings, SettingsProps, ContextProps, Plugin } from '../../typings';
+import { SetConfigItem, Settings, SettingsProps, ContextProps, Plugin, SetItemOptions } from '../../typings';
 import { GlobalParams, Config, ConfigItem, ItemsStateAndParams } from '../../shared';
 import { OverlayControlItem } from '../OverlayControls/OverlayControls';
 interface DashKitGeneralProps {
@@ -24,15 +24,16 @@ interface DashKitDefaultProps {
 }
 export interface DashKitProps extends DashKitGeneralProps, Partial<DashKitDefaultProps> {
 }
-declare type DashKitInnerProps = DashKitGeneralProps & DashKitDefaultProps;
+type DashKitInnerProps = DashKitGeneralProps & DashKitDefaultProps;
 export declare class DashKit extends React.PureComponent<DashKitInnerProps> {
     static defaultProps: DashKitDefaultProps;
     static registerPlugins(...plugins: Plugin[]): void;
     static setSettings(settings: Settings): void;
-    static setItem({ item: setItem, namespace, config, }: {
+    static setItem({ item: setItem, namespace, config, options, }: {
         item: SetConfigItem;
         namespace?: string;
         config: Config;
+        options?: SetItemOptions;
     }): Config;
     static removeItem({ id, config, itemsStateAndParams, }: {
         id: string;

package/build/cjs/components/DashKit/DashKit.js

@@ -21,9 +21,9 @@ class DashKit extends react_1.default.PureComponent {
     static setSettings(settings) {
         registerManager.setSettings(settings);
     }
-    static setItem({ item: setItem, namespace = constants_1.DEFAULT_NAMESPACE, config, }) {
+    static setItem({ item: setItem, namespace = constants_1.DEFAULT_NAMESPACE, config, options = {}, }) {
         if (setItem.id) {
-            return utils_1.UpdateManager.editItem({ item: setItem, namespace, config });
+            return utils_1.UpdateManager.editItem({ item: setItem, namespace, config, options });
         }
         else {
             const item = setItem;
@@ -36,6 +36,7 @@ class DashKit extends react_1.default.PureComponent {
                 namespace,
                 config,
                 layout,
+                options,
             });
         }
     }

package/build/cjs/components/Item/Item.d.ts

@@ -3,12 +3,10 @@ declare const _default: {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;
@@ -29,12 +27,10 @@ declare const _default: {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;

package/build/cjs/components/OverlayControls/OverlayControls.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { ButtonView, ButtonSize, IconProps, MenuItemProps } from '@gravity-ui/uikit';
-import { ConfigItem, PluginBase, StringParams } from '../../shared';
+import { ConfigItem, PluginBase, StringParams, Config } from '../../shared';
+import type { RegisterManager } from '../../utils/register-manager';
 export declare enum OverlayControlsPosition {
     TopRight = "top_right",
     TopLeft = "top_left",
@@ -35,9 +36,17 @@ interface OverlayControlsProps extends OverlayControlsDefaultProps {
     items?: OverlayControlItem[];
     overlayControls?: Record<string, OverlayControlItem[]>;
 }
+type DashKitCtx = React.Context<{
+    registerManager: RegisterManager;
+    itemsParams: Record<string, StringParams>;
+    editItem: (item: ConfigItem) => void;
+    removeItem: (id: string) => void;
+    config: Config;
+}>;
 declare class OverlayControls extends React.Component<OverlayControlsProps> {
     static contextType: React.Context<any>;
     static defaultProps: OverlayControlsDefaultProps;
+    context: React.ContextType<DashKitCtx>;
     render(): JSX.Element;
     private renderControlsItem;
     private getDropDownMenuItemConfig;

package/build/cjs/components/OverlayControls/OverlayControls.js

@@ -143,8 +143,7 @@ class OverlayControls extends react_1.default.Component {
     }
     renderDropdownMenu() {
         const { view, size } = this.props;
-        const { registerManager } = this.context;
-        const itemsParams = this.context.itemsParams;
+        const { registerManager, itemsParams } = this.context;
         const configItem = this.props.configItem;
         const itemParams = itemsParams[configItem.id];
         let menu = registerManager.settings.menu;

package/build/cjs/hocs/prepareItem.d.ts

@@ -3,12 +3,10 @@ export function prepareItem(Component: any): {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;
@@ -29,12 +27,10 @@ export function prepareItem(Component: any): {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;

package/build/cjs/plugins/Text/Text.d.ts

@@ -5,7 +5,7 @@ declare enum LoadStatus {
     Success = "success",
     Fail = "fail"
 }
-export declare type PluginTextApiHandler = (data: {
+export type PluginTextApiHandler = (data: {
     text: string;
 }) => Promise<{
     result: string;
@@ -40,11 +40,11 @@ export declare class PluginText extends React.PureComponent<PluginTextProps, Plu
     private onRetryClick;
     get withMarkdown(): boolean;
 }
-declare type PluginDataProps = Omit<PluginTextProps, 'apiHandler'>;
-export declare type PluginTextObjectSettings = {
+type PluginDataProps = Omit<PluginTextProps, 'apiHandler'>;
+export type PluginTextObjectSettings = {
     apiHandler?: PluginTextApiHandler;
 };
-export declare type PluginTextObject = Plugin<PluginDataProps> & {
+export type PluginTextObject = Plugin<PluginDataProps> & {
     setSettings: (settings: PluginTextObjectSettings) => PluginTextObject;
     _apiHandler?: PluginTextApiHandler;
 };

package/build/cjs/shared/modules/__tests__/uniq-id.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/cjs/shared/modules/__tests__/uniq-id.test.js

@@ -0,0 +1,77 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const hashids_1 = tslib_1.__importDefault(require("hashids"));
+const uniq_id_1 = require("../uniq-id");
+const salt = 'salt';
+const hashids = new hashids_1.default(salt);
+const testCounter = 1;
+const id1 = hashids.encode(testCounter + 1);
+const id2 = hashids.encode(testCounter + 2);
+const id3 = hashids.encode(testCounter + 3);
+const id4 = hashids.encode(testCounter + 4);
+describe('modules.uniq-id: generateUniqId', () => {
+    it('return correct first id and counter', () => {
+        const { id, counter } = (0, uniq_id_1.generateUniqId)({
+            counter: testCounter,
+            ids: [],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id1);
+        expect(id).toEqual(id1);
+        expect(counter).toEqual(testCounter + 1);
+    });
+    it('return correct id and counter with ids=[id1]', () => {
+        const { id, counter } = (0, uniq_id_1.generateUniqId)({
+            counter: testCounter + 1,
+            ids: [id1],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id2);
+        expect(id).toEqual(id2);
+        expect(counter).toEqual(testCounter + 2);
+    });
+    it('return correct id4 and counter with ids=[id1, id2, id3] and incorrect counter=1', () => {
+        const { id, counter } = (0, uniq_id_1.generateUniqId)({
+            counter: 1,
+            ids: [id1, id2, id3],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id4);
+        expect(id).toEqual(id4);
+        expect(counter).toEqual(testCounter + 4);
+    });
+});
+const IDS = ['WZ', '9X', '2m', 'R2', 'Pd'];
+const config = {
+    items: [
+        {
+            id: IDS[0],
+            data: {
+                tabs: [
+                    {
+                        id: IDS[1],
+                    },
+                    {
+                        id: IDS[2],
+                    },
+                ],
+            },
+        },
+        {
+            id: IDS[3],
+        },
+    ],
+    layout: [{ i: IDS[0] }, { i: IDS[3] }],
+    connections: [
+        { from: IDS[2], to: IDS[4] },
+        { from: IDS[1], to: IDS[3] },
+    ],
+};
+describe('modules.uniq-id: extractIdsFromConfig', () => {
+    it('correct extract ids from config', () => {
+        const ids = (0, uniq_id_1.extractIdsFromConfig)(config);
+        expect(Array.isArray(ids)).toBe(true);
+        expect(IDS.concat().sort()).toEqual(ids.sort());
+    });
+});

package/build/cjs/shared/modules/helpers.d.ts

@@ -6,7 +6,7 @@ export declare function prerenderItems({ items, plugins, }: {
 export declare function getItemsStateAndParamsMeta(itemsStateAndParams: ItemsStateAndParams): StateAndParamsMetaData | undefined;
 export declare function getCurrentVersion(itemsStateAndParams: ItemsStateAndParams): number;
 export declare function isItemWithTabs(item: Pick<ConfigItem, 'data'>): item is Pick<ConfigItemWithTabs, 'data'>;
-export declare type FormedQueueData = {
+export type FormedQueueData = {
     id: string;
     namespace: string;
     params: StringParams;

package/build/cjs/shared/modules/index.d.ts

@@ -1,2 +1,3 @@
 export * from './helpers';
 export * from './state-and-params';
+export * from './uniq-id';

package/build/cjs/shared/modules/index.js

@@ -3,3 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./helpers"), exports);
 tslib_1.__exportStar(require("./state-and-params"), exports);
+tslib_1.__exportStar(require("./uniq-id"), exports);

package/build/cjs/shared/modules/state-and-params.d.ts

@@ -6,7 +6,7 @@ export interface GetItemsParamsArg {
     itemsStateAndParams: ItemsStateAndParams;
     plugins: PluginBase[];
 }
-declare type GetItemsParamsReturn = Record<string, StringParams>;
+type GetItemsParamsReturn = Record<string, StringParams>;
 export declare function getItemsParams({ defaultGlobalParams, globalParams, config, itemsStateAndParams, plugins, }: GetItemsParamsArg): GetItemsParamsReturn;
 export declare function getItemsState({ config, itemsStateAndParams, }: {
     config: Config;

package/build/cjs/shared/modules/uniq-id.d.ts

@@ -0,0 +1,12 @@
+import type { Config } from '../types';
+export declare function extractIdsFromConfig(config: Config): string[];
+type GenerateUniqIdArgs = {
+    salt: Config['salt'];
+    counter: Config['counter'];
+    ids: string[];
+};
+export declare function generateUniqId({ salt, counter, ids }: GenerateUniqIdArgs): {
+    counter: number;
+    id: string;
+};
+export {};

package/build/cjs/shared/modules/uniq-id.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateUniqId = exports.extractIdsFromConfig = void 0;
+const tslib_1 = require("tslib");
+const hashids_1 = tslib_1.__importDefault(require("hashids"));
+const helpers_1 = require("./helpers");
+function extractIdsFromConfig(config) {
+    const ids = [];
+    const items = config.items || [];
+    const connections = config.connections || [];
+    const layout = config.layout || [];
+    items.forEach((item) => {
+        ids.push(item.id);
+        if ((0, helpers_1.isItemWithTabs)(item)) {
+            item.data.tabs.forEach((tabItem) => ids.push(tabItem.id));
+        }
+    });
+    connections.forEach(({ from, to }) => ids.push(from, to));
+    layout.forEach(({ i }) => ids.push(i));
+    return Array.from(new Set(ids));
+}
+exports.extractIdsFromConfig = extractIdsFromConfig;
+function generateUniqId({ salt, counter, ids }) {
+    let newCounter = counter;
+    let uniqId = null;
+    const idsSet = new Set(ids);
+    const hashids = new hashids_1.default(salt);
+    while (uniqId === null) {
+        const id = hashids.encode(++newCounter);
+        if (!idsSet.has(id)) {
+            uniqId = id;
+        }
+    }
+    return { counter: newCounter, id: uniqId };
+}
+exports.generateUniqId = generateUniqId;

package/build/cjs/shared/types/common.d.ts

@@ -1,4 +1,4 @@
-export declare type Dictionary<T = unknown> = Record<string, T>;
+export type Dictionary<T = unknown> = Record<string, T>;
 export interface StringParams extends Dictionary<string | string[]> {
 }
 export interface GlobalParams extends StringParams {

package/build/cjs/shared/types/state-and-params.d.ts

@@ -7,16 +7,16 @@ export interface QueueItem {
     id: string;
     tabId?: string;
 }
-export declare type StateAndParamsMetaData = {
+export type StateAndParamsMetaData = {
     queue: QueueItem[];
     version: number;
 };
-export declare type StateAndParamsMeta = {
+export type StateAndParamsMeta = {
     [META_KEY]: StateAndParamsMetaData;
 };
-export declare type ItemStateAndParams = {
+export type ItemStateAndParams = {
     params?: StringParams;
     state?: ItemState;
 };
-export declare type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
-export declare type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;
+export type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
+export type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;

package/build/cjs/typings/common.d.ts

@@ -11,7 +11,7 @@ export interface Settings {
     isMobile?: boolean;
     menu?: Array<MenuItem>;
 }
-export declare type MenuItem = typeof MenuItems[keyof typeof MenuItems] | OverlayCustomControlItem;
+export type MenuItem = typeof MenuItems[keyof typeof MenuItems] | OverlayCustomControlItem;
 export interface SettingsProps {
     autoupdateInterval: number;
     silentLoading: boolean;

package/build/cjs/typings/config.d.ts

@@ -4,4 +4,7 @@ export interface AddConfigItem extends Omit<ConfigItem, 'id' | 'namespace'> {
     namespace?: string;
     layout?: ConfigLayout;
 }
-export declare type SetConfigItem = ConfigItem | AddConfigItem;
+export type SetConfigItem = ConfigItem | AddConfigItem;
+export type SetItemOptions = {
+    excludeIds?: string[];
+};

package/build/cjs/utils/configure.d.ts

@@ -1,8 +1,8 @@
-export declare type Lang = 'ru' | 'en';
+export type Lang = 'ru' | 'en';
 interface Config {
     lang?: Lang;
 }
-declare type Subscriber = (config: Config) => void;
+type Subscriber = (config: Config) => void;
 export declare const configure: (newConfig: Config) => void;
 export declare const subscribeConfigure: (sub: Subscriber) => () => void;
 export declare const getConfig: () => Config;

package/build/cjs/utils/get-new-id.d.ts

@@ -0,0 +1,12 @@
+import { Config } from '../shared';
+type GetNewIdArgs = {
+    config: Config;
+    salt: Config['salt'];
+    counter: Config['counter'];
+    excludeIds?: string[];
+};
+export declare function getNewId({ config, salt, counter, excludeIds }: GetNewIdArgs): {
+    counter: number;
+    id: string;
+};
+export {};

package/build/cjs/utils/get-new-id.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getNewId = void 0;
+const shared_1 = require("../shared");
+function getNewId({ config, salt, counter, excludeIds = [] }) {
+    const allIds = [...(0, shared_1.extractIdsFromConfig)(config), ...excludeIds];
+    return (0, shared_1.generateUniqId)({ salt, counter, ids: allIds });
+}
+exports.getNewId = getNewId;

package/build/cjs/utils/register-manager.d.ts

@@ -7,17 +7,17 @@ interface RegisterManagerDefaultLayout {
     minW: number;
     minH: number;
 }
-export declare type RegisterManagerPluginLayout = RegisterManagerDefaultLayout & PluginDefaultLayout;
+export type RegisterManagerPluginLayout = RegisterManagerDefaultLayout & PluginDefaultLayout;
 export interface RegisterManagerPlugin extends Omit<Plugin, 'defaultLayout'> {
     defaultLayout: RegisterManagerDefaultLayout & Plugin['defaultLayout'];
 }
-export declare type RegisterManagerGridLayout = {
+export type RegisterManagerGridLayout = {
     margin: [number, number];
     rowHeight: number;
     cols: number;
     containerPadding: [number, number];
 } & Settings['gridLayout'];
-export declare type RegisterManagerSettings = {
+export type RegisterManagerSettings = {
     theme: string;
 } & Settings;
 export declare class RegisterManager {

package/build/cjs/utils/update-manager.d.ts

@@ -1,5 +1,5 @@
 import { Config, ConfigItem, ItemsStateAndParams, ItemStateAndParams } from '../shared';
-import { AddConfigItem, WidgetLayout } from '../typings';
+import { AddConfigItem, WidgetLayout, SetItemOptions } from '../typings';
 import { RegisterManagerPluginLayout } from './register-manager';
 interface RemoveItemArg {
     id: string;
@@ -13,16 +13,18 @@ interface ChangeStateAndParamsArg {
     stateAndParams: ItemStateAndParams;
 }
 export declare class UpdateManager {
-    static addItem({ item, namespace, layout, config, }: {
+    static addItem({ item, namespace, layout, config, options, }: {
         item: AddConfigItem;
         namespace: string;
         layout: RegisterManagerPluginLayout;
         config: Config;
+        options: SetItemOptions;
     }): Config;
-    static editItem({ item, namespace, config, }: {
+    static editItem({ item, namespace, config, options, }: {
         item: ConfigItem;
         namespace: string;
         config: Config;
+        options: SetItemOptions;
     }): Config;
     static removeItem({ id, config, itemsStateAndParams }: RemoveItemArg): {
         config: Config;

package/build/cjs/utils/update-manager.js

@@ -3,11 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.UpdateManager = void 0;
 const tslib_1 = require("tslib");
 const immutability_helper_1 = tslib_1.__importStar(require("immutability-helper"));
-const hashids_1 = tslib_1.__importDefault(require("hashids"));
 const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
 const pick_1 = tslib_1.__importDefault(require("lodash/pick"));
 const shared_1 = require("../shared");
 const constants_1 = require("../constants");
+const get_new_id_1 = require("./get-new-id");
 (0, immutability_helper_1.extend)('$auto', (value, object) => (object ? (0, immutability_helper_1.default)(object, value) : (0, immutability_helper_1.default)({}, value)));
 function removeItemVersion1({ id, config, itemsStateAndParams }) {
     const itemIndex = config.items.findIndex((item) => item.id === id);
@@ -134,30 +134,51 @@ function changeStateAndParamsVersion1({ id: initiatorId, config, stateAndParams,
         return itemsStateAndParams;
     }
 }
+function getNewItemData({ item, config, counter: argsCounter, salt, options }) {
+    const excludeIds = [...(options.excludeIds || [])];
+    let counter = argsCounter;
+    let data = item.data;
+    if ((0, shared_1.isItemWithTabs)(item)) {
+        const tabs = item.data.tabs.map((tab) => {
+            if (tab.id) {
+                return tab;
+            }
+            const newIdTabData = (0, get_new_id_1.getNewId)({ config, salt, counter, excludeIds });
+            counter = newIdTabData.counter;
+            excludeIds.push(newIdTabData.id);
+            return Object.assign(Object.assign({}, tab), { id: newIdTabData.id });
+        });
+        data = Object.assign(Object.assign({}, item.data), { tabs });
+    }
+    return { data, counter, excludeIds };
+}
 class UpdateManager {
-    // TODO: проверять, что id нового элемента уникальный
-    static addItem({ item, namespace = constants_1.DEFAULT_NAMESPACE, layout, config, }) {
+    static addItem({ item, namespace = constants_1.DEFAULT_NAMESPACE, layout, config, options, }) {
         const layoutY = Math.max(0, ...config.layout.map(({ h, y }) => h + y));
         const saveDefaultLayout = (0, pick_1.default)(layout, ['h', 'w', 'x', 'y']);
-        const hashids = new hashids_1.default(config.salt);
-        let counter = config.counter;
-        const resultData = (0, shared_1.isItemWithTabs)(item)
-            ? Object.assign(Object.assign({}, item.data), { tabs: item.data.tabs.map((tab) => tab.id ? tab : Object.assign(Object.assign({}, tab), { id: hashids.encode(++counter) })) }) : item.data;
-        const newItem = Object.assign(Object.assign({}, item), { id: hashids.encode(++counter), data: resultData, namespace });
+        const salt = config.salt;
+        const newItemData = getNewItemData({ item, config, salt, counter: config.counter, options });
+        let counter = newItemData.counter;
+        const newIdData = (0, get_new_id_1.getNewId)({ config, salt, counter, excludeIds: newItemData.excludeIds });
+        counter = newIdData.counter;
+        const newItem = Object.assign(Object.assign({}, item), { id: newIdData.id, data: newItemData.data, namespace });
         return (0, immutability_helper_1.default)(config, {
             items: { $push: [newItem] },
             layout: { $push: [Object.assign(Object.assign({}, saveDefaultLayout), { y: layoutY, i: newItem.id })] },
             counter: { $set: counter },
         });
     }
-    static editItem({ item, namespace = constants_1.DEFAULT_NAMESPACE, config, }) {
-        const hashids = new hashids_1.default(config.salt);
-        let counter = config.counter;
+    static editItem({ item, namespace = constants_1.DEFAULT_NAMESPACE, config, options, }) {
         const itemIndex = config.items.findIndex(({ id }) => item.id === id);
-        const resultData = (0, shared_1.isItemWithTabs)(item)
-            ? Object.assign(Object.assign({}, item.data), { tabs: item.data.tabs.map((tab) => tab.id ? tab : Object.assign(Object.assign({}, tab), { id: hashids.encode(++counter) })) }) : item.data;
+        const { counter, data } = getNewItemData({
+            item,
+            config,
+            salt: config.salt,
+            counter: config.counter,
+            options,
+        });
         return (0, immutability_helper_1.default)(config, {
-            items: { [itemIndex]: { $set: Object.assign(Object.assign({}, item), { data: resultData, namespace }) } },
+            items: { [itemIndex]: { $set: Object.assign(Object.assign({}, item), { data, namespace }) } },
             counter: { $set: counter },
         });
     }

package/build/esm/components/DashKit/DashKit.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import GridLayout from '../GridLayout/GridLayout';
-import { SetConfigItem, Settings, SettingsProps, ContextProps, Plugin } from '../../typings';
+import { SetConfigItem, Settings, SettingsProps, ContextProps, Plugin, SetItemOptions } from '../../typings';
 import { GlobalParams, Config, ConfigItem, ItemsStateAndParams } from '../../shared';
 import { OverlayControlItem } from '../OverlayControls/OverlayControls';
 interface DashKitGeneralProps {
@@ -24,15 +24,16 @@ interface DashKitDefaultProps {
 }
 export interface DashKitProps extends DashKitGeneralProps, Partial<DashKitDefaultProps> {
 }
-declare type DashKitInnerProps = DashKitGeneralProps & DashKitDefaultProps;
+type DashKitInnerProps = DashKitGeneralProps & DashKitDefaultProps;
 export declare class DashKit extends React.PureComponent<DashKitInnerProps> {
     static defaultProps: DashKitDefaultProps;
     static registerPlugins(...plugins: Plugin[]): void;
     static setSettings(settings: Settings): void;
-    static setItem({ item: setItem, namespace, config, }: {
+    static setItem({ item: setItem, namespace, config, options, }: {
         item: SetConfigItem;
         namespace?: string;
         config: Config;
+        options?: SetItemOptions;
     }): Config;
     static removeItem({ id, config, itemsStateAndParams, }: {
         id: string;

package/build/esm/components/DashKit/DashKit.js

@@ -17,9 +17,9 @@ export class DashKit extends React.PureComponent {
     static setSettings(settings) {
         registerManager.setSettings(settings);
     }
-    static setItem({ item: setItem, namespace = DEFAULT_NAMESPACE, config, }) {
+    static setItem({ item: setItem, namespace = DEFAULT_NAMESPACE, config, options = {}, }) {
         if (setItem.id) {
-            return UpdateManager.editItem({ item: setItem, namespace, config });
+            return UpdateManager.editItem({ item: setItem, namespace, config, options });
         }
         else {
             const item = setItem;
@@ -32,6 +32,7 @@ export class DashKit extends React.PureComponent {
                 namespace,
                 config,
                 layout,
+                options,
             });
         }
     }

package/build/esm/components/Item/Item.d.ts

@@ -3,12 +3,10 @@ declare const _default: {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;
@@ -29,12 +27,10 @@ declare const _default: {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;

package/build/esm/components/OverlayControls/OverlayControls.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { ButtonView, ButtonSize, IconProps, MenuItemProps } from '@gravity-ui/uikit';
-import { ConfigItem, PluginBase, StringParams } from '../../shared';
+import { ConfigItem, PluginBase, StringParams, Config } from '../../shared';
+import type { RegisterManager } from '../../utils/register-manager';
 import './OverlayControls.css';
 export declare enum OverlayControlsPosition {
     TopRight = "top_right",
@@ -36,9 +37,17 @@ interface OverlayControlsProps extends OverlayControlsDefaultProps {
     items?: OverlayControlItem[];
     overlayControls?: Record<string, OverlayControlItem[]>;
 }
+type DashKitCtx = React.Context<{
+    registerManager: RegisterManager;
+    itemsParams: Record<string, StringParams>;
+    editItem: (item: ConfigItem) => void;
+    removeItem: (id: string) => void;
+    config: Config;
+}>;
 declare class OverlayControls extends React.Component<OverlayControlsProps> {
     static contextType: React.Context<any>;
     static defaultProps: OverlayControlsDefaultProps;
+    context: React.ContextType<DashKitCtx>;
     render(): JSX.Element;
     private renderControlsItem;
     private getDropDownMenuItemConfig;

package/build/esm/components/OverlayControls/OverlayControls.js

@@ -140,8 +140,7 @@ class OverlayControls extends React.Component {
     }
     renderDropdownMenu() {
         const { view, size } = this.props;
-        const { registerManager } = this.context;
-        const itemsParams = this.context.itemsParams;
+        const { registerManager, itemsParams } = this.context;
         const configItem = this.props.configItem;
         const itemParams = itemsParams[configItem.id];
         let menu = registerManager.settings.menu;

package/build/esm/hocs/prepareItem.d.ts

@@ -3,12 +3,10 @@ export function prepareItem(Component: any): {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;
@@ -29,12 +27,10 @@ export function prepareItem(Component: any): {
         shouldComponentUpdate(nextProps: any): boolean;
         _onStateAndParamsChange: (stateAndParams: any) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<any> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<any>;
         state: Readonly<any>;
         refs: {
             [key: string]: React.ReactInstance;

package/build/esm/plugins/Text/Text.d.ts

@@ -6,7 +6,7 @@ declare enum LoadStatus {
     Success = "success",
     Fail = "fail"
 }
-export declare type PluginTextApiHandler = (data: {
+export type PluginTextApiHandler = (data: {
     text: string;
 }) => Promise<{
     result: string;
@@ -41,11 +41,11 @@ export declare class PluginText extends React.PureComponent<PluginTextProps, Plu
     private onRetryClick;
     get withMarkdown(): boolean;
 }
-declare type PluginDataProps = Omit<PluginTextProps, 'apiHandler'>;
-export declare type PluginTextObjectSettings = {
+type PluginDataProps = Omit<PluginTextProps, 'apiHandler'>;
+export type PluginTextObjectSettings = {
     apiHandler?: PluginTextApiHandler;
 };
-export declare type PluginTextObject = Plugin<PluginDataProps> & {
+export type PluginTextObject = Plugin<PluginDataProps> & {
     setSettings: (settings: PluginTextObjectSettings) => PluginTextObject;
     _apiHandler?: PluginTextApiHandler;
 };

package/build/esm/shared/modules/__tests__/uniq-id.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/esm/shared/modules/__tests__/uniq-id.test.js

@@ -0,0 +1,74 @@
+import Hashids from 'hashids';
+import { generateUniqId, extractIdsFromConfig } from '../uniq-id';
+const salt = 'salt';
+const hashids = new Hashids(salt);
+const testCounter = 1;
+const id1 = hashids.encode(testCounter + 1);
+const id2 = hashids.encode(testCounter + 2);
+const id3 = hashids.encode(testCounter + 3);
+const id4 = hashids.encode(testCounter + 4);
+describe('modules.uniq-id: generateUniqId', () => {
+    it('return correct first id and counter', () => {
+        const { id, counter } = generateUniqId({
+            counter: testCounter,
+            ids: [],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id1);
+        expect(id).toEqual(id1);
+        expect(counter).toEqual(testCounter + 1);
+    });
+    it('return correct id and counter with ids=[id1]', () => {
+        const { id, counter } = generateUniqId({
+            counter: testCounter + 1,
+            ids: [id1],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id2);
+        expect(id).toEqual(id2);
+        expect(counter).toEqual(testCounter + 2);
+    });
+    it('return correct id4 and counter with ids=[id1, id2, id3] and incorrect counter=1', () => {
+        const { id, counter } = generateUniqId({
+            counter: 1,
+            ids: [id1, id2, id3],
+            salt,
+        });
+        expect(hashids.encode(counter)).toEqual(id4);
+        expect(id).toEqual(id4);
+        expect(counter).toEqual(testCounter + 4);
+    });
+});
+const IDS = ['WZ', '9X', '2m', 'R2', 'Pd'];
+const config = {
+    items: [
+        {
+            id: IDS[0],
+            data: {
+                tabs: [
+                    {
+                        id: IDS[1],
+                    },
+                    {
+                        id: IDS[2],
+                    },
+                ],
+            },
+        },
+        {
+            id: IDS[3],
+        },
+    ],
+    layout: [{ i: IDS[0] }, { i: IDS[3] }],
+    connections: [
+        { from: IDS[2], to: IDS[4] },
+        { from: IDS[1], to: IDS[3] },
+    ],
+};
+describe('modules.uniq-id: extractIdsFromConfig', () => {
+    it('correct extract ids from config', () => {
+        const ids = extractIdsFromConfig(config);
+        expect(Array.isArray(ids)).toBe(true);
+        expect(IDS.concat().sort()).toEqual(ids.sort());
+    });
+});

package/build/esm/shared/modules/helpers.d.ts

@@ -6,7 +6,7 @@ export declare function prerenderItems({ items, plugins, }: {
 export declare function getItemsStateAndParamsMeta(itemsStateAndParams: ItemsStateAndParams): StateAndParamsMetaData | undefined;
 export declare function getCurrentVersion(itemsStateAndParams: ItemsStateAndParams): number;
 export declare function isItemWithTabs(item: Pick<ConfigItem, 'data'>): item is Pick<ConfigItemWithTabs, 'data'>;
-export declare type FormedQueueData = {
+export type FormedQueueData = {
     id: string;
     namespace: string;
     params: StringParams;

package/build/esm/shared/modules/index.d.ts

@@ -1,2 +1,3 @@
 export * from './helpers';
 export * from './state-and-params';
+export * from './uniq-id';

package/build/esm/shared/modules/index.js

@@ -1,2 +1,3 @@
 export * from './helpers';
 export * from './state-and-params';
+export * from './uniq-id';

package/build/esm/shared/modules/state-and-params.d.ts

@@ -6,7 +6,7 @@ export interface GetItemsParamsArg {
     itemsStateAndParams: ItemsStateAndParams;
     plugins: PluginBase[];
 }
-declare type GetItemsParamsReturn = Record<string, StringParams>;
+type GetItemsParamsReturn = Record<string, StringParams>;
 export declare function getItemsParams({ defaultGlobalParams, globalParams, config, itemsStateAndParams, plugins, }: GetItemsParamsArg): GetItemsParamsReturn;
 export declare function getItemsState({ config, itemsStateAndParams, }: {
     config: Config;

package/build/esm/shared/modules/uniq-id.d.ts

@@ -0,0 +1,12 @@
+import type { Config } from '../types';
+export declare function extractIdsFromConfig(config: Config): string[];
+type GenerateUniqIdArgs = {
+    salt: Config['salt'];
+    counter: Config['counter'];
+    ids: string[];
+};
+export declare function generateUniqId({ salt, counter, ids }: GenerateUniqIdArgs): {
+    counter: number;
+    id: string;
+};
+export {};

package/build/esm/shared/modules/uniq-id.js

@@ -0,0 +1,30 @@
+import Hashids from 'hashids';
+import { isItemWithTabs } from './helpers';
+export function extractIdsFromConfig(config) {
+    const ids = [];
+    const items = config.items || [];
+    const connections = config.connections || [];
+    const layout = config.layout || [];
+    items.forEach((item) => {
+        ids.push(item.id);
+        if (isItemWithTabs(item)) {
+            item.data.tabs.forEach((tabItem) => ids.push(tabItem.id));
+        }
+    });
+    connections.forEach(({ from, to }) => ids.push(from, to));
+    layout.forEach(({ i }) => ids.push(i));
+    return Array.from(new Set(ids));
+}
+export function generateUniqId({ salt, counter, ids }) {
+    let newCounter = counter;
+    let uniqId = null;
+    const idsSet = new Set(ids);
+    const hashids = new Hashids(salt);
+    while (uniqId === null) {
+        const id = hashids.encode(++newCounter);
+        if (!idsSet.has(id)) {
+            uniqId = id;
+        }
+    }
+    return { counter: newCounter, id: uniqId };
+}

package/build/esm/shared/types/common.d.ts

@@ -1,4 +1,4 @@
-export declare type Dictionary<T = unknown> = Record<string, T>;
+export type Dictionary<T = unknown> = Record<string, T>;
 export interface StringParams extends Dictionary<string | string[]> {
 }
 export interface GlobalParams extends StringParams {

package/build/esm/shared/types/state-and-params.d.ts

@@ -7,16 +7,16 @@ export interface QueueItem {
     id: string;
     tabId?: string;
 }
-export declare type StateAndParamsMetaData = {
+export type StateAndParamsMetaData = {
     queue: QueueItem[];
     version: number;
 };
-export declare type StateAndParamsMeta = {
+export type StateAndParamsMeta = {
     [META_KEY]: StateAndParamsMetaData;
 };
-export declare type ItemStateAndParams = {
+export type ItemStateAndParams = {
     params?: StringParams;
     state?: ItemState;
 };
-export declare type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
-export declare type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;
+export type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
+export type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;

package/build/esm/typings/common.d.ts

@@ -11,7 +11,7 @@ export interface Settings {
     isMobile?: boolean;
     menu?: Array<MenuItem>;
 }
-export declare type MenuItem = typeof MenuItems[keyof typeof MenuItems] | OverlayCustomControlItem;
+export type MenuItem = typeof MenuItems[keyof typeof MenuItems] | OverlayCustomControlItem;
 export interface SettingsProps {
     autoupdateInterval: number;
     silentLoading: boolean;

package/build/esm/typings/config.d.ts

@@ -4,4 +4,7 @@ export interface AddConfigItem extends Omit<ConfigItem, 'id' | 'namespace'> {
     namespace?: string;
     layout?: ConfigLayout;
 }
-export declare type SetConfigItem = ConfigItem | AddConfigItem;
+export type SetConfigItem = ConfigItem | AddConfigItem;
+export type SetItemOptions = {
+    excludeIds?: string[];
+};

package/build/esm/utils/configure.d.ts

@@ -1,8 +1,8 @@
-export declare type Lang = 'ru' | 'en';
+export type Lang = 'ru' | 'en';
 interface Config {
     lang?: Lang;
 }
-declare type Subscriber = (config: Config) => void;
+type Subscriber = (config: Config) => void;
 export declare const configure: (newConfig: Config) => void;
 export declare const subscribeConfigure: (sub: Subscriber) => () => void;
 export declare const getConfig: () => Config;

package/build/esm/utils/get-new-id.d.ts

@@ -0,0 +1,12 @@
+import { Config } from '../shared';
+type GetNewIdArgs = {
+    config: Config;
+    salt: Config['salt'];
+    counter: Config['counter'];
+    excludeIds?: string[];
+};
+export declare function getNewId({ config, salt, counter, excludeIds }: GetNewIdArgs): {
+    counter: number;
+    id: string;
+};
+export {};

package/build/esm/utils/get-new-id.js

@@ -0,0 +1,5 @@
+import { extractIdsFromConfig, generateUniqId } from '../shared';
+export function getNewId({ config, salt, counter, excludeIds = [] }) {
+    const allIds = [...extractIdsFromConfig(config), ...excludeIds];
+    return generateUniqId({ salt, counter, ids: allIds });
+}

package/build/esm/utils/register-manager.d.ts

@@ -7,17 +7,17 @@ interface RegisterManagerDefaultLayout {
     minW: number;
     minH: number;
 }
-export declare type RegisterManagerPluginLayout = RegisterManagerDefaultLayout & PluginDefaultLayout;
+export type RegisterManagerPluginLayout = RegisterManagerDefaultLayout & PluginDefaultLayout;
 export interface RegisterManagerPlugin extends Omit<Plugin, 'defaultLayout'> {
     defaultLayout: RegisterManagerDefaultLayout & Plugin['defaultLayout'];
 }
-export declare type RegisterManagerGridLayout = {
+export type RegisterManagerGridLayout = {
     margin: [number, number];
     rowHeight: number;
     cols: number;
     containerPadding: [number, number];
 } & Settings['gridLayout'];
-export declare type RegisterManagerSettings = {
+export type RegisterManagerSettings = {
     theme: string;
 } & Settings;
 export declare class RegisterManager {

package/build/esm/utils/update-manager.d.ts

@@ -1,5 +1,5 @@
 import { Config, ConfigItem, ItemsStateAndParams, ItemStateAndParams } from '../shared';
-import { AddConfigItem, WidgetLayout } from '../typings';
+import { AddConfigItem, WidgetLayout, SetItemOptions } from '../typings';
 import { RegisterManagerPluginLayout } from './register-manager';
 interface RemoveItemArg {
     id: string;
@@ -13,16 +13,18 @@ interface ChangeStateAndParamsArg {
     stateAndParams: ItemStateAndParams;
 }
 export declare class UpdateManager {
-    static addItem({ item, namespace, layout, config, }: {
+    static addItem({ item, namespace, layout, config, options, }: {
         item: AddConfigItem;
         namespace: string;
         layout: RegisterManagerPluginLayout;
         config: Config;
+        options: SetItemOptions;
     }): Config;
-    static editItem({ item, namespace, config, }: {
+    static editItem({ item, namespace, config, options, }: {
         item: ConfigItem;
         namespace: string;
         config: Config;
+        options: SetItemOptions;
     }): Config;
     static removeItem({ id, config, itemsStateAndParams }: RemoveItemArg): {
         config: Config;

package/build/esm/utils/update-manager.js

@@ -1,9 +1,9 @@
 import update, { extend } from 'immutability-helper';
-import Hashids from 'hashids';
 import omit from 'lodash/omit';
 import pick from 'lodash/pick';
 import { mergeParamsWithAliases, isItemWithTabs, getCurrentVersion, META_KEY, deleteFromQueue, addToQueue, getInitialItemsStateAndParamsMeta, resolveItemInnerId, getItemsStateAndParamsMeta, } from '../shared';
 import { DEFAULT_NAMESPACE } from '../constants';
+import { getNewId } from './get-new-id';
 extend('$auto', (value, object) => (object ? update(object, value) : update({}, value)));
 function removeItemVersion1({ id, config, itemsStateAndParams }) {
     const itemIndex = config.items.findIndex((item) => item.id === id);
@@ -130,30 +130,51 @@ function changeStateAndParamsVersion1({ id: initiatorId, config, stateAndParams,
         return itemsStateAndParams;
     }
 }
+function getNewItemData({ item, config, counter: argsCounter, salt, options }) {
+    const excludeIds = [...(options.excludeIds || [])];
+    let counter = argsCounter;
+    let data = item.data;
+    if (isItemWithTabs(item)) {
+        const tabs = item.data.tabs.map((tab) => {
+            if (tab.id) {
+                return tab;
+            }
+            const newIdTabData = getNewId({ config, salt, counter, excludeIds });
+            counter = newIdTabData.counter;
+            excludeIds.push(newIdTabData.id);
+            return Object.assign(Object.assign({}, tab), { id: newIdTabData.id });
+        });
+        data = Object.assign(Object.assign({}, item.data), { tabs });
+    }
+    return { data, counter, excludeIds };
+}
 export class UpdateManager {
-    // TODO: проверять, что id нового элемента уникальный
-    static addItem({ item, namespace = DEFAULT_NAMESPACE, layout, config, }) {
+    static addItem({ item, namespace = DEFAULT_NAMESPACE, layout, config, options, }) {
         const layoutY = Math.max(0, ...config.layout.map(({ h, y }) => h + y));
         const saveDefaultLayout = pick(layout, ['h', 'w', 'x', 'y']);
-        const hashids = new Hashids(config.salt);
-        let counter = config.counter;
-        const resultData = isItemWithTabs(item)
-            ? Object.assign(Object.assign({}, item.data), { tabs: item.data.tabs.map((tab) => tab.id ? tab : Object.assign(Object.assign({}, tab), { id: hashids.encode(++counter) })) }) : item.data;
-        const newItem = Object.assign(Object.assign({}, item), { id: hashids.encode(++counter), data: resultData, namespace });
+        const salt = config.salt;
+        const newItemData = getNewItemData({ item, config, salt, counter: config.counter, options });
+        let counter = newItemData.counter;
+        const newIdData = getNewId({ config, salt, counter, excludeIds: newItemData.excludeIds });
+        counter = newIdData.counter;
+        const newItem = Object.assign(Object.assign({}, item), { id: newIdData.id, data: newItemData.data, namespace });
         return update(config, {
             items: { $push: [newItem] },
             layout: { $push: [Object.assign(Object.assign({}, saveDefaultLayout), { y: layoutY, i: newItem.id })] },
             counter: { $set: counter },
         });
     }
-    static editItem({ item, namespace = DEFAULT_NAMESPACE, config, }) {
-        const hashids = new Hashids(config.salt);
-        let counter = config.counter;
+    static editItem({ item, namespace = DEFAULT_NAMESPACE, config, options, }) {
         const itemIndex = config.items.findIndex(({ id }) => item.id === id);
-        const resultData = isItemWithTabs(item)
-            ? Object.assign(Object.assign({}, item.data), { tabs: item.data.tabs.map((tab) => tab.id ? tab : Object.assign(Object.assign({}, tab), { id: hashids.encode(++counter) })) }) : item.data;
+        const { counter, data } = getNewItemData({
+            item,
+            config,
+            salt: config.salt,
+            counter: config.counter,
+            options,
+        });
         return update(config, {
-            items: { [itemIndex]: { $set: Object.assign(Object.assign({}, item), { data: resultData, namespace }) } },
+            items: { [itemIndex]: { $set: Object.assign(Object.assign({}, item), { data, namespace }) } },
             counter: { $set: counter },
         });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dashkit",
-  "version": "4.1.0",
+  "version": "5.1.0",
   "description": "Library for rendering dashboard grid layout",
   "license": "MIT",
   "repository": {
@@ -41,25 +41,25 @@
     "react-grid-layout": "^1.3.4"
   },
   "peerDependencies": {
-    "@gravity-ui/uikit": "^3.0.0",
+    "@gravity-ui/uikit": "^4.0.0",
     "bem-cn-lite": "^4.0.0",
-    "react": "^16.0.0  || ^17.0.0"
+    "react": "^16.8.0  || ^17 || ^18"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.0.3",
     "@commitlint/config-conventional": "^17.0.3",
+    "@gravity-ui/eslint-config": "^1.0.2",
+    "@gravity-ui/prettier-config": "^1.0.1",
+    "@gravity-ui/stylelint-config": "^1.0.1",
+    "@gravity-ui/tsconfig": "^1.0.0",
+    "@gravity-ui/uikit": "^4.0.5",
     "@storybook/addon-essentials": "^6.5.9",
     "@storybook/preset-scss": "^1.0.3",
     "@storybook/react": "^6.5.9",
     "@types/enzyme": "^3.10.8",
     "@types/jest": "^26.0.20",
     "@types/lodash": "^4.14.170",
-    "@types/react": "^17.0.47",
-    "@gravity-ui/eslint-config": "^1.0.2",
-    "@gravity-ui/prettier-config": "^1.0.1",
-    "@gravity-ui/stylelint-config": "^1.0.1",
-    "@gravity-ui/tsconfig": "^1.0.0",
-    "@gravity-ui/uikit": "^3.0.0",
+    "@types/react": "^18.0.27",
     "babel-jest": "^26.6.3",
     "bem-cn-lite": "^4.0.0",
     "copyfiles": "^2.4.1",
@@ -78,15 +78,15 @@
     "npm-run-all": "^4.1.5",
     "postcss": "^8.4.12",
     "prettier": "^2.6.0",
-    "react": "^17.0.2",
+    "react": "^18.2.0",
     "react-docgen-typescript": "^2.2.2",
-    "react-dom": "^17.0.2",
+    "react-dom": "^18.2.0",
     "rimraf": "^3.0.2",
     "sass": "^1.53.0",
     "sass-loader": "^10.3.1",
     "stylelint": "^14.6.0",
     "ts-jest": "^26.5.3",
-    "typescript": "^4.7.4"
+    "typescript": "^4.9.5"
   },
   "husky": {
     "hooks": {