@gravity-ui/dashkit 8.22.1 → 8.23.0

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import type { Config, ConfigItem, ConfigLayout, GlobalParams, ItemDropProps, ItemsStateAndParams } from '../../shared';
-import { AddNewItemOptions, ContextProps, DashKitGroup, ItemManipulationCallback, MenuItem, Plugin, SetConfigItem, Settings, SettingsProps } from '../../typings';
+import type { AddNewItemOptions, ContextProps, DashKitGroup, ItemManipulationCallback, MenuItem, Plugin, SetConfigItem, Settings, SettingsProps } from '../../typings';
 import GridLayout from '../GridLayout/GridLayout';
-import { OverlayControlItem, OverlayControlsCtxShape } from '../OverlayControls/OverlayControls';
-interface DashKitGeneralProps extends Pick<OverlayControlsCtxShape, 'getPreparedCopyItemOptions' | 'onCopyFulfill'> {
+import type { OverlayControlItem, PreparedCopyItemOptions } from '../OverlayControls/OverlayControls';
+interface DashKitGeneralProps {
     config: Config;
     editMode: boolean;
     draggableHandleClassName?: string;
@@ -11,6 +11,14 @@ interface DashKitGeneralProps extends Pick<OverlayControlsCtxShape, 'getPrepared
     overlayMenuItems?: MenuItem[] | null;
 }
 interface DashKitDefaultProps {
+    defaultGlobalParams: GlobalParams;
+    globalParams: GlobalParams;
+    itemsStateAndParams: ItemsStateAndParams;
+    settings: SettingsProps;
+    context: ContextProps;
+    noOverlay: boolean;
+    focusable?: boolean;
+    groups?: DashKitGroup[];
     onItemEdit: (item: ConfigItem) => void;
     onChange: (data: {
         config: Config;
@@ -23,27 +31,21 @@ interface DashKitDefaultProps {
         isMounted: boolean;
     }) => void;
     onItemRender?: (item: ConfigItem) => void;
+    getPreparedCopyItemOptions?: (options: PreparedCopyItemOptions) => PreparedCopyItemOptions;
+    onCopyFulfill?: (error: null | Error, data?: PreparedCopyItemOptions) => void;
     onDragStart?: ItemManipulationCallback;
     onDrag?: ItemManipulationCallback;
     onDragStop?: ItemManipulationCallback;
     onResizeStart?: ItemManipulationCallback;
     onResize?: ItemManipulationCallback;
     onResizeStop?: ItemManipulationCallback;
-    defaultGlobalParams: GlobalParams;
-    globalParams: GlobalParams;
-    itemsStateAndParams: ItemsStateAndParams;
-    settings: SettingsProps;
-    context: ContextProps;
-    noOverlay: boolean;
-    focusable?: boolean;
-    groups?: DashKitGroup[];
 }
 export interface DashKitProps extends DashKitGeneralProps, Partial<DashKitDefaultProps> {
 }
 type DashKitInnerProps = DashKitGeneralProps & DashKitDefaultProps;
 export declare class DashKit extends React.PureComponent<DashKitInnerProps> {
     static defaultProps: DashKitDefaultProps;
-    static contextType: React.Context<any>;
+    static contextType: React.Context<void | import("../../context").DashKitDnDCtxShape>;
     static registerPlugins(...plugins: Plugin[]): void;
     static reloadPlugins(...plugins: Plugin[]): void;
     static setSettings(settings: Settings): void;

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

@@ -6,7 +6,7 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
 const pick_1 = tslib_1.__importDefault(require("lodash/pick"));
 const constants_1 = require("../../constants");
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const utils_1 = require("../../utils");
 const DashKitDnDWrapper_1 = require("../DashKitDnDWrapper/DashKitDnDWrapper");
 const DashKitView_1 = tslib_1.__importDefault(require("../DashKitView/DashKitView"));
@@ -112,4 +112,4 @@ DashKit.defaultProps = {
     noOverlay: false,
     focusable: false,
 };
-DashKit.contextType = DashKitContext_1.DashKitDnDContext;
+DashKit.contextType = context_1.DashKitDnDContext;

package/build/cjs/components/DashKitDnDWrapper/DashKitDnDWrapper.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DashKitDnDWrapper = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const defaultImageSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
 const DashKitDnDWrapper = (props) => {
     const [dragProps, setDragProps] = react_1.default.useState(null);
@@ -31,6 +31,6 @@ const DashKitDnDWrapper = (props) => {
             onDropDragOver: props.onDropDragOver,
         };
     }, [dragProps, dragImagePreview, onDragStart, onDragEnd, props.onDropDragOver]);
-    return (react_1.default.createElement(DashKitContext_1.DashKitDnDContext.Provider, { value: contextValue }, props.children));
+    return (react_1.default.createElement(context_1.DashKitDnDContext.Provider, { value: contextValue }, props.children));
 };
 exports.DashKitDnDWrapper = DashKitDnDWrapper;

package/build/cjs/components/DashKitView/DashKitView.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const withContext_1 = require("../../hocs/withContext");
 const useCalcLayout_1 = require("../../hooks/useCalcLayout");
 const cn_1 = require("../../utils/cn");
@@ -10,7 +10,7 @@ const GridLayout_1 = tslib_1.__importDefault(require("../GridLayout/GridLayout")
 const MobileLayout_1 = tslib_1.__importDefault(require("../MobileLayout/MobileLayout"));
 const b = (0, cn_1.cn)('dashkit');
 function DashKitView() {
-    const context = react_1.default.useContext(DashKitContext_1.DashKitContext);
+    const context = react_1.default.useContext(context_1.DashKitContext);
     const { registerManager, forwardedMetaRef } = context;
     return (react_1.default.createElement("div", { className: b({ theme: registerManager.settings.theme }) }, registerManager.settings.isMobile ? (react_1.default.createElement(MobileLayout_1.default, null)) : (react_1.default.createElement(GridLayout_1.default, { ref: forwardedMetaRef }))));
 }

package/build/cjs/components/GridItem/GridItem.js

@@ -4,7 +4,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const prop_types_1 = tslib_1.__importDefault(require("prop-types"));
 const constants_1 = require("../../constants");
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const cn_1 = require("../../utils/cn");
 const Item_1 = tslib_1.__importDefault(require("../Item/Item"));
 const OverlayControls_1 = tslib_1.__importDefault(require("../OverlayControls/OverlayControls"));
@@ -156,7 +156,7 @@ GridItem.propTypes = {
     onTouchEnd: prop_types_1.default.func,
     onTouchStart: prop_types_1.default.func,
 };
-GridItem.contextType = DashKitContext_1.DashKitContext;
+GridItem.contextType = context_1.DashKitContext;
 const GridItemForwarderRef = react_1.default.forwardRef((props, ref) => {
     return react_1.default.createElement(GridItem, Object.assign({}, props, { forwardedRef: ref }));
 });

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

@@ -1,5 +1,5 @@
 export default class GridLayout extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<any>;
+    static contextType: React.Context<import("../../context").DashKitCtxShape>;
     constructor(props: any, context: any);
     pluginsRefs: any[];
     state: {

package/build/cjs/components/GridLayout/GridLayout.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const constants_1 = require("../../constants");
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const utils_1 = require("../../utils");
 const GridItem_1 = tslib_1.__importDefault(require("../GridItem/GridItem"));
 const ReactGridLayout_1 = require("./ReactGridLayout");
@@ -501,6 +501,7 @@ class GridLayout extends react_1.default.PureComponent {
                 offset += items.length;
                 if (group.render) {
                     const groupContext = {
+                        isMobile: false,
                         config,
                         editMode,
                         items,
@@ -517,5 +518,5 @@ class GridLayout extends react_1.default.PureComponent {
         }
     }
 }
-GridLayout.contextType = DashKitContext_1.DashKitContext;
+GridLayout.contextType = context_1.DashKitContext;
 exports.default = GridLayout;

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

@@ -66,7 +66,8 @@ declare const _default: {
         onItemMountChange: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
     };
-    contextType: React.Context<any>;
+    contextType: React.Context<import("../../context").DashKitCtxShape>;
 };
 export default _default;
 import React from 'react';
+import PropTypes from 'prop-types';

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

@@ -1,23 +1,30 @@
-export default class MobileLayout extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<any>;
-    constructor(props: any);
-    constructor(props: any, context: any);
-    pluginsRefs: any[];
-    sortedLayoutItems: any;
-    _memoLayout: any;
-    _memoForwardedPluginRef: any[];
-    _memoAdjustWidgetLayout: any[];
-    state: {
-        activeTabId: null;
-        indexesOfItemsWithActiveAutoheight: {};
-    };
-    componentDidUpdate(prevProps: any, prevState: any): void;
-    getSortedLayoutItems(): any;
-    getMemoForwardRefCallback: (refIndex: any) => any;
-    adjustWidgetLayout: (index: any, { needSetDefault }: {
-        needSetDefault: any;
-    }) => void;
-    getMemoAdjustWidgetLayout: (index: any) => any;
+import React from 'react';
+import { DashKitContext } from '../../context';
+import { getSortedConfigItems } from './helpers';
+type MobileLayoutProps = {};
+type MobileLayoutState = {
+    itemsWithActiveAutoheight: Record<string, boolean>;
+};
+type PlugibRefObject = React.RefObject<any>;
+export default class MobileLayout extends React.PureComponent<MobileLayoutProps, MobileLayoutState> {
+    static contextType: React.Context<import("../../context").DashKitCtxShape>;
+    context: React.ContextType<typeof DashKitContext>;
+    pluginsRefs: PlugibRefObject[];
+    sortedLayoutItems: Record<string, ReturnType<typeof getSortedConfigItems>> | null;
+    _memoLayout: import("../..").ConfigLayout[];
+    _memoForwardedPluginRef: Array<(refObject: PlugibRefObject) => void>;
+    _memoAdjustWidgetLayout: Record<string, (props: {
+        needSetDefault: boolean;
+    }) => void>;
+    state: MobileLayoutState;
     render(): JSX.Element;
+    getSortedLayoutItems(): Record<string, (import("../..").ConfigItem & import("../..").ConfigLayout)[]>;
+    getMemoForwardRefCallback(refIndex: number): (refObject: PlugibRefObject) => void;
+    adjustWidgetLayout(id: string, { needSetDefault }: {
+        needSetDefault: boolean;
+    }): void;
+    getMemoAdjustWidgetLayout(id: string): (props: {
+        needSetDefault: boolean;
+    }) => void;
 }
-import React from 'react';
+export {};

package/build/cjs/components/MobileLayout/MobileLayout.js

@@ -2,7 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const DashKitContext_1 = require("../../context/DashKitContext");
+const groupBy_1 = tslib_1.__importDefault(require("lodash/groupBy"));
+const constants_1 = require("../../constants");
+const context_1 = require("../../context");
 const cn_1 = require("../../utils/cn");
 const Item_1 = tslib_1.__importDefault(require("../Item/Item"));
 const helpers_1 = require("./helpers");
@@ -11,47 +13,40 @@ class MobileLayout extends react_1.default.PureComponent {
     constructor() {
         super(...arguments);
         this.pluginsRefs = [];
+        this.sortedLayoutItems = null;
         this._memoLayout = this.context.layout;
         this._memoForwardedPluginRef = [];
-        this._memoAdjustWidgetLayout = [];
+        this._memoAdjustWidgetLayout = {};
         this.state = {
-            activeTabId: null,
-            indexesOfItemsWithActiveAutoheight: {},
-        };
-        this.getMemoForwardRefCallback = (refIndex) => {
-            if (!this._memoForwardedPluginRef[refIndex]) {
-                this._memoForwardedPluginRef[refIndex] = (pluginRef) => {
-                    this.pluginsRefs[refIndex] = pluginRef;
-                };
-            }
-            return this._memoForwardedPluginRef[refIndex];
-        };
-        this.adjustWidgetLayout = (index, { needSetDefault }) => {
-            if (needSetDefault) {
-                const indexesOfItemsWithActiveAutoheight = Object.assign({}, this.state.indexesOfItemsWithActiveAutoheight);
-                delete indexesOfItemsWithActiveAutoheight[index];
-                this.setState({ indexesOfItemsWithActiveAutoheight });
-            }
-            else {
-                this.setState({
-                    indexesOfItemsWithActiveAutoheight: Object.assign({}, this.state.indexesOfItemsWithActiveAutoheight, { [index]: true }),
-                });
-            }
-        };
-        this.getMemoAdjustWidgetLayout = (index) => {
-            if (!this._memoAdjustWidgetLayout[index]) {
-                this._memoAdjustWidgetLayout[index] = this.adjustWidgetLayout.bind(this, index);
-            }
-            return this._memoAdjustWidgetLayout[index];
+            itemsWithActiveAutoheight: {},
         };
     }
-    componentDidUpdate(prevProps, prevState) {
-        if (prevState.activeTabId !== this.context.config.id) {
-            this.setState({
-                activeTabId: this.context.config.id,
-                indexesOfItemsWithActiveAutoheight: {},
+    render() {
+        const { config, layout, groups = [{ id: constants_1.DEFAULT_GROUP }], context, editMode } = this.context;
+        this.pluginsRefs.length = config.items.length;
+        const sortedItems = this.getSortedLayoutItems();
+        let indexOffset = 0;
+        return (react_1.default.createElement("div", { className: b() }, groups.map((group) => {
+            const groupId = group.id || constants_1.DEFAULT_GROUP;
+            const items = sortedItems[groupId] || [];
+            const children = items.map((item, index) => {
+                const isItemWithActiveAutoheight = item.id in this.state.itemsWithActiveAutoheight;
+                return (react_1.default.createElement("div", { className: b('item', { autoheight: isItemWithActiveAutoheight }), key: item.id },
+                    react_1.default.createElement(Item_1.default, { id: item.id, item: item, layout: layout, shouldItemUpdate: false, adjustWidgetLayout: this.getMemoAdjustWidgetLayout(item.id), forwardedPluginRef: this.getMemoForwardRefCallback(indexOffset + index), onItemMountChange: this.context.onItemMountChange, onItemRender: this.context.onItemRender })));
             });
-        }
+            indexOffset += items.length;
+            if (group.render) {
+                return group.render(groupId, children, {
+                    isMobile: true,
+                    config,
+                    context,
+                    editMode,
+                    items,
+                    layout,
+                });
+            }
+            return children;
+        })));
     }
     getSortedLayoutItems() {
         if (this.sortedLayoutItems && this.context.layout === this._memoLayout) {
@@ -59,19 +54,37 @@ class MobileLayout extends react_1.default.PureComponent {
         }
         this._memoLayout = this.context.layout;
         const hasOrderId = Boolean(this.context.config.items.find((item) => item.orderId));
-        this.sortedLayoutItems = (0, helpers_1.getSortedConfigItems)(this.context.config, hasOrderId);
+        this.sortedLayoutItems = (0, groupBy_1.default)((0, helpers_1.getSortedConfigItems)(this.context.config, hasOrderId), (item) => item.parent || constants_1.DEFAULT_GROUP);
         return this.sortedLayoutItems;
     }
-    render() {
-        const { config, layout } = this.context;
-        this.pluginsRefs.length = config.items.length;
-        const sortedItems = this.getSortedLayoutItems();
-        return (react_1.default.createElement("div", { className: b() }, sortedItems.map((item, index) => {
-            const isItemWithActiveAutoheight = index in this.state.indexesOfItemsWithActiveAutoheight;
-            return (react_1.default.createElement("div", { className: b('item', { autoheight: isItemWithActiveAutoheight }), key: item.id },
-                react_1.default.createElement(Item_1.default, { id: item.id, item: item, layout: layout, shouldItemUpdate: false, adjustWidgetLayout: this.getMemoAdjustWidgetLayout(index), forwardedPluginRef: this.getMemoForwardRefCallback(index), onMountChange: this.onMountChange, onItemMountChange: this.context.onItemMountChange, onItemRender: this.context.onItemRender })));
-        })));
+    getMemoForwardRefCallback(refIndex) {
+        if (!this._memoForwardedPluginRef[refIndex]) {
+            this._memoForwardedPluginRef[refIndex] = (pluginRef) => {
+                this.pluginsRefs[refIndex] = pluginRef;
+            };
+        }
+        return this._memoForwardedPluginRef[refIndex];
+    }
+    adjustWidgetLayout(id, { needSetDefault }) {
+        if (needSetDefault) {
+            const indexesOfItemsWithActiveAutoheight = Object.assign({}, this.state.itemsWithActiveAutoheight);
+            delete indexesOfItemsWithActiveAutoheight[id];
+            this.setState({ itemsWithActiveAutoheight: indexesOfItemsWithActiveAutoheight });
+        }
+        else {
+            this.setState({
+                itemsWithActiveAutoheight: Object.assign({}, this.state.itemsWithActiveAutoheight, {
+                    [id]: true,
+                }),
+            });
+        }
+    }
+    getMemoAdjustWidgetLayout(id) {
+        if (!this._memoAdjustWidgetLayout[id]) {
+            this._memoAdjustWidgetLayout[id] = this.adjustWidgetLayout.bind(this, id);
+        }
+        return this._memoAdjustWidgetLayout[id];
     }
 }
-MobileLayout.contextType = DashKitContext_1.DashKitContext;
+MobileLayout.contextType = context_1.DashKitContext;
 exports.default = MobileLayout;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ButtonSize, ButtonView, IconProps, MenuItemProps } from '@gravity-ui/uikit';
-import { type ConfigItem, type ConfigLayout, type ItemState, type ItemsStateAndParamsBase, type PluginBase, type StringParams } from '../../shared';
-import { MenuItem } from '../../typings';
+import { OverlayControlsCtxShape } from '../../context';
+import { type ConfigItem, type ItemParams, type ItemState, type PluginBase } from '../../shared';
 export declare enum OverlayControlsPosition {
     TopRight = "top_right",
     TopLeft = "top_left",
@@ -24,7 +24,7 @@ export interface OverlayCustomControlItem {
     title?: string;
     icon?: MenuItemProps['icon'];
     iconSize?: number | string;
-    handler?: (item: ConfigItem, params: StringParams, state: ItemState) => void;
+    handler?: (item: ConfigItem, params: ItemParams, state: ItemState) => void;
     visible?: (item: ConfigItem) => boolean;
     className?: string;
     qa?: string;
@@ -50,21 +50,9 @@ type PreparedCopyItemOptionsArg = Pick<ConfigItem, 'data' | 'type' | 'defaults'
 export type PreparedCopyItemOptions<C extends object = {}> = PreparedCopyItemOptionsArg & {
     copyContext?: C;
 };
-export interface OverlayControlsCtxShape {
-    overlayControls?: Record<string, OverlayControlItem[]>;
-    context: Record<string, any>;
-    menu: MenuItem[];
-    itemsStateAndParams: ItemsStateAndParamsBase;
-    itemsParams: Record<string, StringParams>;
-    editItem: (item: ConfigItem) => void;
-    removeItem: (id: string) => void;
-    getLayoutItem: (id: string) => ConfigLayout | void;
-    getPreparedCopyItemOptions?: (options: PreparedCopyItemOptions) => PreparedCopyItemOptions;
-    onCopyFulfill?: (error: null | Error, data?: PreparedCopyItemOptions) => void;
-}
 type OverlayControlsCtx = React.Context<OverlayControlsCtxShape>;
 declare class OverlayControls extends React.Component<OverlayControlsProps> {
-    static contextType: React.Context<any>;
+    static contextType: React.Context<void | OverlayControlsCtxShape>;
     static defaultProps: OverlayControlsDefaultProps;
     context: React.ContextType<OverlayControlsCtx>;
     render(): JSX.Element;

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

@@ -7,7 +7,7 @@ const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
 const constants_1 = require("../../constants");
-const DashKitContext_1 = require("../../context/DashKitContext");
+const context_1 = require("../../context");
 const i18n_1 = require("../../i18n");
 const shared_1 = require("../../shared");
 const cn_1 = require("../../utils/cn");
@@ -122,9 +122,9 @@ class OverlayControls extends react_1.default.Component {
             (_l = (_k = this.props).onItemClick) === null || _l === void 0 ? void 0 : _l.call(_k);
         };
         this.onEditItem = () => {
-            var _a, _b;
-            this.context.editItem(this.props.configItem);
-            (_b = (_a = this.props).onItemClick) === null || _b === void 0 ? void 0 : _b.call(_a);
+            var _a, _b, _c, _d;
+            (_b = (_a = this.context).editItem) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.configItem);
+            (_d = (_c = this.props).onItemClick) === null || _d === void 0 ? void 0 : _d.call(_c);
         };
         this.onRemoveItem = () => {
             var _a, _b;
@@ -195,13 +195,12 @@ class OverlayControls extends react_1.default.Component {
         return menu === null || menu === void 0 ? void 0 : menu.every((item) => Object.values(constants_1.MenuItems).includes(String(item)));
     }
     renderDropdownMenu(isOnlyOneItem) {
-        var _a;
         const { view, size, onItemClick } = this.props;
-        const { menu: contextMenu, itemsParams, itemsStateAndParams } = this.context;
+        const { menu: contextMenu, itemsParams, itemsState } = this.context;
         const configItem = this.props.configItem;
         const itemParams = itemsParams[configItem.id];
-        const itemState = ((_a = itemsStateAndParams[configItem.id]) === null || _a === void 0 ? void 0 : _a.state) || {};
-        const menu = (contextMenu === null || contextMenu === void 0 ? void 0 : contextMenu.length) > 0 ? contextMenu : DEFAULT_DROPDOWN_MENU;
+        const itemState = (itemsState === null || itemsState === void 0 ? void 0 : itemsState[configItem.id]) || {};
+        const menu = contextMenu && contextMenu.length > 0 ? contextMenu : DEFAULT_DROPDOWN_MENU;
         const isDefaultMenu = this.isDefaultMenu(menu);
         const items = isDefaultMenu
             ? (menu || []).reduce((memo, name) => {
@@ -270,7 +269,7 @@ class OverlayControls extends react_1.default.Component {
         return result;
     }
 }
-OverlayControls.contextType = DashKitContext_1.DashkitOvelayControlsContext;
+OverlayControls.contextType = context_1.DashkitOvelayControlsContext;
 OverlayControls.defaultProps = {
     position: OverlayControlsPosition.TopRight,
     view: 'flat',

package/build/cjs/context/DashKitContext.d.ts

@@ -1,4 +1,31 @@
-export const DashKitContext: React.Context<any>;
-export const DashkitOvelayControlsContext: React.Context<any>;
-export const DashKitDnDContext: React.Context<any>;
+/// <reference types="react-grid-layout" />
 import React from 'react';
+import type { RegisterManager } from '..//utils';
+import type { DashKitProps } from '../components/DashKit';
+import type { ConfigItem, ConfigLayout, ItemParams, ItemState, ItemStateAndParams, ItemStateAndParamsChangeOptions } from '../shared';
+type DashkitPropsPassedToCtx = Pick<DashKitProps, 'config' | 'groups' | 'context' | 'noOverlay' | 'focusable' | 'globalParams' | 'editMode' | 'settings' | 'onItemMountChange' | 'onItemRender' | 'draggableHandleClassName' | 'onDragStart' | 'onDrag' | 'onDragStop' | 'onResizeStart' | 'onResize' | 'onResizeStop'>;
+type PluginType = string;
+export type DashKitCtxShape = DashkitPropsPassedToCtx & {
+    registerManager: RegisterManager;
+    forwardedMetaRef: React.ForwardedRef<any>;
+    layout: ConfigLayout[];
+    temporaryLayout: ConfigLayout[] | null;
+    memorizeOriginalLayout: (widgetId: string, preAutoHeightLayout: ConfigLayout, postAutoHeightLayout: ConfigLayout) => void;
+    revertToOriginalLayout: (widgetId: string) => void;
+    itemsState?: Record<string, ItemState>;
+    itemsParams: Record<string, ItemParams>;
+    onItemStateAndParamsChange: (id: string, stateAndParams: ItemStateAndParams, options: ItemStateAndParamsChangeOptions) => void;
+    getItemsMeta: (pluginsRefs: Array<React.RefObject<any>>) => Array<Promise<any>>;
+    reloadItems: (pluginsRefs: Array<React.RefObject<any>>, data: {
+        silentLoading: boolean;
+        noVeil: boolean;
+    }) => void;
+    onDrop: (newLayout: ConfigLayout, item: ConfigItem) => void;
+    onDropDragOver: (e: DragEvent | MouseEvent, group: string | void, gridProps: Partial<ReactGridLayout.ReactGridLayoutProps>, groupLayout: ConfigLayout[], sharedItem: (Partial<ConfigLayout> & {
+        type: PluginType;
+    }) | void) => void | boolean;
+    outerDnDEnable: boolean;
+    dragOverPlugin: null | PluginType;
+};
+declare const DashKitContext: React.Context<DashKitCtxShape>;
+export { DashKitContext };

package/build/cjs/context/DashKitContext.js

@@ -1,11 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DashKitDnDContext = exports.DashkitOvelayControlsContext = exports.DashKitContext = void 0;
+exports.DashKitContext = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const DashKitContext = react_1.default.createContext();
+const DashKitContext = react_1.default.createContext({});
 exports.DashKitContext = DashKitContext;
-const DashkitOvelayControlsContext = react_1.default.createContext();
-exports.DashkitOvelayControlsContext = DashkitOvelayControlsContext;
-const DashKitDnDContext = react_1.default.createContext();
-exports.DashKitDnDContext = DashKitDnDContext;

package/build/cjs/context/DashKitDnDContext.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { DraggedOverItem, ItemDragProps } from '../shared/types';
+export type DashKitDnDCtxShape = {
+    dragProps: ItemDragProps | null;
+    dragImagePreview: HTMLImageElement;
+    onDragStart: (e: React.DragEvent<Element>, itemDragProps: ItemDragProps) => void;
+    onDragEnd: (e: React.DragEvent<Element>) => void;
+    onDropDragOver?: (draggedItem: DraggedOverItem, sharedItem: DraggedOverItem | null) => void | boolean;
+};
+export declare const DashKitDnDContext: React.Context<void | DashKitDnDCtxShape>;

package/build/cjs/context/DashKitDnDContext.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashKitDnDContext = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+exports.DashKitDnDContext = react_1.default.createContext(undefined);

package/build/cjs/context/DashkitOverlayControlsContext.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { DashKitProps } from '../components';
+import type { ConfigLayout, ItemParams, ItemState } from '../shared';
+import type { MenuItem } from '../typings';
+export type OverlayControlsCtxShape = Pick<DashKitProps, 'context' | 'overlayControls' | 'itemsStateAndParams' | 'getPreparedCopyItemOptions' | 'onCopyFulfill'> & {
+    menu: DashKitProps['overlayMenuItems'] | MenuItem[];
+    itemsState?: Record<string, ItemState>;
+    itemsParams: Record<string, ItemParams>;
+    editItem: DashKitProps['onItemEdit'];
+    removeItem: (id: string) => void;
+    getLayoutItem: (id: string) => ConfigLayout | void;
+};
+export declare const DashkitOvelayControlsContext: React.Context<void | OverlayControlsCtxShape>;

package/build/cjs/context/DashkitOverlayControlsContext.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashkitOvelayControlsContext = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+exports.DashkitOvelayControlsContext = react_1.default.createContext(undefined);

package/build/cjs/context/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DashKitContext';
+export * from './DashkitOverlayControlsContext';
+export * from './DashKitDnDContext';

package/build/cjs/context/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./DashKitContext"), exports);
+tslib_1.__exportStar(require("./DashkitOverlayControlsContext"), exports);
+tslib_1.__exportStar(require("./DashKitDnDContext"), exports);

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

@@ -66,6 +66,7 @@ export function prepareItem(Component: any): {
         onItemMountChange: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
     };
-    contextType: React.Context<any>;
+    contextType: React.Context<import("../context").DashKitCtxShape>;
 };
 import React from 'react';
+import PropTypes from 'prop-types';

package/build/cjs/hocs/prepareItem.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
 const prop_types_1 = tslib_1.__importDefault(require("prop-types"));
-const DashKitContext_1 = require("../context/DashKitContext");
+const context_1 = require("../context");
 function prepareItem(Component) {
     var _a;
     return _a = class PrepareItem extends react_1.default.Component {
@@ -83,7 +83,7 @@ function prepareItem(Component) {
             onItemMountChange: prop_types_1.default.func,
             forwardedPluginRef: prop_types_1.default.any,
         },
-        _a.contextType = DashKitContext_1.DashKitContext,
+        _a.contextType = context_1.DashKitContext,
         _a;
 }
 exports.prepareItem = prepareItem;