@gravity-ui/dashkit 8.9.1 → 8.10.0

package/README.md

@@ -30,6 +30,8 @@ interface DashKitProps {
   onItemEdit: ({id}: {id: string}) => void;
   onChange: (data: {config: Config; itemsStateAndParams: ItemsStateAndParams}) => void;
   onDrop: (dropProps: ItemDropProps) => void;
+  onItemMountChange: (item: ConfigItem, state: {isAsync: boolead; isMounted: boolean}) => void;
+  onItemRender: (item: ConfigItem) => void;
   defaultGlobalParams: GlobalParams;
   globalParams: GlobalParams;
   itemsStateAndParams: ItemsStateAndParams;
@@ -48,6 +50,8 @@ interface DashKitProps {
 - **onItemEdit**: Called when you click to edit a widget.
 - **onChange**: Called when config or [itemsStateAndParams](#temsStateAndParams) are changed.
 - **onDrop**: Called when item dropped from ActionPanel using (#DashKitDnDWrapper)
+- **onItemMountChange**: Called when item mount state changed
+- **onItemRender**: Called when item render complete
 - **defaultGlobalParams**, **globalParams**: [Parameters](#Params) that affect all widgets. In DataLens, `defaultGlobalParams` are global parameters set in the dashboard settings. `globalParams` are globals parameters that can be set in the url.
 - **itemsStateAndParams**: [itemsStateAndParams](#temsStateAndParams).
 - **settings**: DashKit settings.

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

@@ -18,6 +18,11 @@ interface DashKitDefaultProps {
         groups?: DashKitGroup[];
     }) => void;
     onDrop: (dropProps: ItemDropProps) => void;
+    onItemMountChange?: (item: ConfigItem, state: {
+        isAsync: boolean;
+        isMounted: boolean;
+    }) => void;
+    onItemRender?: (item: ConfigItem) => void;
     defaultGlobalParams: GlobalParams;
     globalParams: GlobalParams;
     itemsStateAndParams: ItemsStateAndParams;

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

@@ -38,6 +38,7 @@ const windowFocusObserver = new WindowFocusObserver();
 class GridItem extends react_1.default.PureComponent {
     constructor() {
         super(...arguments);
+        this._isAsyncItem = false;
         this.state = {
             isFocused: false,
         };
@@ -56,6 +57,33 @@ class GridItem extends react_1.default.PureComponent {
                 this.controller = null;
             });
         };
+        this.onMountChange = (isMounted) => {
+            var _a, _b, _c, _d, _e, _f;
+            if (isMounted) {
+                this._inited = true;
+                (_b = (_a = this.props).onItemMountChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.item, {
+                    isAsync: this._isAsyncItem,
+                    isMounted: isMounted,
+                });
+                if (!this._isAsyncItem) {
+                    (_d = (_c = this.props).onItemRender) === null || _d === void 0 ? void 0 : _d.call(_c, this.props.item);
+                }
+            }
+            else {
+                (_f = (_e = this.props).onItemMountChange) === null || _f === void 0 ? void 0 : _f.call(_e, this.props.item, {
+                    isAsync: this._isAsyncItem,
+                    isMounted: isMounted,
+                });
+            }
+        };
+        this.onBeforeLoad = () => {
+            this._isAsyncItem = true;
+            return this.onLoad;
+        };
+        this.onLoad = () => {
+            var _a, _b;
+            (_b = (_a = this.props).onItemRender) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.item);
+        };
     }
     renderOverlay() {
         const { isPlaceholder } = this.props;
@@ -71,7 +99,7 @@ class GridItem extends react_1.default.PureComponent {
     render() {
         // из-за бага, что Grid Items unmounts при изменении static, isDraggable, isResaizable
         // https://github.com/STRML/react-grid-layout/issues/721
-        const { style, onMouseDown, onMouseUp, onTouchEnd, onTouchStart, children, className, isDragging, noOverlay, focusable, withCustomHandle, isPlaceholder, } = this.props;
+        const { style, onMouseDown, onMouseUp, onTouchEnd, onTouchStart, children, className, isDragging, noOverlay, focusable, withCustomHandle, isPlaceholder = false, } = this.props;
         const { editMode } = this.context;
         const width = Number.parseInt(style.width, 10);
         const height = Number.parseInt(style.height, 10);
@@ -96,7 +124,7 @@ class GridItem extends react_1.default.PureComponent {
             }
             : {})),
             react_1.default.createElement("div", { className: b('item', { editMode: editMode && !_editActive && !noOverlay }) },
-                react_1.default.createElement(Item_1.default, { id: this.props.id, item: this.props.item, shouldItemUpdate: !isDragging, width: width, height: height, transform: transform, isPlaceholder: isPlaceholder, adjustWidgetLayout: this.props.adjustWidgetLayout, layout: this.props.layout, forwardedPluginRef: this.props.forwardedPluginRef })),
+                react_1.default.createElement(Item_1.default, { id: this.props.id, item: this.props.item, shouldItemUpdate: !isDragging, width: width, height: height, transform: transform, isPlaceholder: isPlaceholder, adjustWidgetLayout: this.props.adjustWidgetLayout, layout: this.props.layout, forwardedPluginRef: this.props.forwardedPluginRef, onMountChange: this.onMountChange, onBeforeLoad: this.onBeforeLoad })),
             !noOverlay && this.renderOverlay(),
             preparedChildren));
     }

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

@@ -287,7 +287,7 @@ class GridLayout extends react_1.default.PureComponent {
         return (react_1.default.createElement(GridItem_1.default, { key: id, id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName) }));
     }
     renderGroup(group, renderLayout, renderItems, offset = 0, groupGridProperties) {
-        const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, } = this.context;
+        const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, onItemMountChange, onItemRender, } = this.context;
         const { currentDraggingElement, draggedOverGroup } = this.state;
         const properties = groupGridProperties
             ? groupGridProperties(Object.assign({}, registerManager.gridLayout))
@@ -310,7 +310,7 @@ class GridLayout extends react_1.default.PureComponent {
             }
             : null), { draggableCancel: `.${constants_1.OVERLAY_CONTROLS_CLASS_NAME}` }),
             renderItems.map((item, i) => {
-                return (react_1.default.createElement(GridItem_1.default, { forwardedPluginRef: this.getMemoForwardRefCallback(offset + i), key: item.id, id: item.id, item: item, layout: layout, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, noOverlay: noOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName) }));
+                return (react_1.default.createElement(GridItem_1.default, { forwardedPluginRef: this.getMemoForwardRefCallback(offset + i), key: item.id, id: item.id, item: item, layout: layout, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, noOverlay: noOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName), onItemMountChange: onItemMountChange, onItemRender: onItemRender }));
             }),
             this.renderTemporaryPlaceholder()));
     }

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

@@ -61,7 +61,9 @@ declare const _default: {
         height: PropTypes.Requireable<number>;
         transform: PropTypes.Requireable<string>;
         isPlaceholder: PropTypes.Requireable<boolean>;
+        onBeforeLoad: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
+        onMountChange: PropTypes.Requireable<(...args: any[]) => any>;
     };
     contextType: React.Context<any>;
 };

package/build/cjs/components/Item/Item.js

@@ -7,9 +7,18 @@ const prepareItem_1 = require("../../hocs/prepareItem");
 const cn_1 = require("../../utils/cn");
 const b = (0, cn_1.cn)('dashkit-item');
 // TODO: getDerivedStateFromError и заглушка с ошибкой
-const Item = ({ registerManager, rendererProps, type, isPlaceholder, forwardedPluginRef }) => {
+const Item = ({ registerManager, rendererProps, type, isPlaceholder, forwardedPluginRef, onMountChange, }) => {
     var _a, _b;
-    if (!registerManager.check(type)) {
+    const isRegisteredType = registerManager.check(type);
+    react_1.default.useLayoutEffect(() => {
+        if (isRegisteredType && !isPlaceholder) {
+            onMountChange === null || onMountChange === void 0 ? void 0 : onMountChange(true);
+            return () => {
+                onMountChange === null || onMountChange === void 0 ? void 0 : onMountChange(false);
+            };
+        }
+    }, []);
+    if (!isRegisteredType) {
         console.warn(`type [${type}] не зарегистрирован`);
         return null;
     }
@@ -25,5 +34,7 @@ Item.propTypes = {
     registerManager: prop_types_1.default.object,
     type: prop_types_1.default.string,
     isPlaceholder: prop_types_1.default.bool,
+    onMountChange: prop_types_1.default.func,
+    onBeforeLoad: prop_types_1.default.func,
 };
 exports.default = (0, prepareItem_1.prepareItem)(Item);

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

@@ -61,7 +61,9 @@ export function prepareItem(Component: any): {
         height: PropTypes.Requireable<number>;
         transform: PropTypes.Requireable<string>;
         isPlaceholder: PropTypes.Requireable<boolean>;
+        onBeforeLoad: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
+        onMountChange: PropTypes.Requireable<(...args: any[]) => any>;
     };
     contextType: React.Context<any>;
 };

package/build/cjs/hocs/prepareItem.js

@@ -15,7 +15,7 @@ function prepareItem(Component) {
                 };
                 this._currentRenderProps = {};
                 this.getRenderProps = () => {
-                    const { id, width, height, item, adjustWidgetLayout, layout, isPlaceholder } = this.props;
+                    const { id, width, height, item, adjustWidgetLayout, layout, isPlaceholder, onBeforeLoad, } = this.props;
                     const { itemsState, itemsParams, registerManager, settings, context, editMode } = this.context;
                     const { data, defaults, namespace } = item;
                     const rendererProps = {
@@ -24,6 +24,7 @@ function prepareItem(Component) {
                         params: itemsParams[id],
                         state: itemsState[id],
                         onStateAndParamsChange: this._onStateAndParamsChange,
+                        onBeforeLoad,
                         width,
                         height,
                         id,
@@ -55,10 +56,10 @@ function prepareItem(Component) {
                 return true;
             }
             render() {
-                const { item, isPlaceholder } = this.props;
+                const { item, isPlaceholder, forwardedPluginRef, onMountChange } = this.props;
                 const { registerManager } = this.context;
                 const { type } = item;
-                return (react_1.default.createElement(Component, { forwardedPluginRef: this.props.forwardedPluginRef, rendererProps: this.getRenderProps(), registerManager: registerManager, type: type, isPlaceholder: isPlaceholder }));
+                return (react_1.default.createElement(Component, { forwardedPluginRef: forwardedPluginRef, rendererProps: this.getRenderProps(), registerManager: registerManager, type: type, isPlaceholder: isPlaceholder, onMountChange: onMountChange }));
             }
         },
         _a.propTypes = {
@@ -71,7 +72,9 @@ function prepareItem(Component) {
             height: prop_types_1.default.number,
             transform: prop_types_1.default.string,
             isPlaceholder: prop_types_1.default.bool,
+            onBeforeLoad: prop_types_1.default.func,
             forwardedPluginRef: prop_types_1.default.any,
+            onMountChange: prop_types_1.default.func,
         },
         _a.contextType = DashKitContext_1.DashKitContext,
         _a;

package/build/cjs/hocs/withContext.js

@@ -320,6 +320,8 @@ function useMemoStateContext(props) {
         onItemStateAndParamsChange,
         onDrop,
         onDropDragOver,
+        onItemMountChange: props.onItemMountChange,
+        onItemRender: props.onItemRender,
         layoutChange: onLayoutChange,
         getItemsMeta,
         reloadItems,
@@ -347,6 +349,8 @@ function useMemoStateContext(props) {
         onDrop,
         onDropDragOver,
         onLayoutChange,
+        props.onItemMountChange,
+        props.onItemRender,
         getItemsMeta,
         reloadItems,
         memorizeOriginalLayout,

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

@@ -15,6 +15,7 @@ export interface PluginTextProps extends PluginWidgetProps {
     data: {
         text: string;
     } & PluginWidgetProps['data'];
+    onBeforeRender: () => () => void;
 }
 interface PluginTextState {
     htmlText: string;

package/build/cjs/plugins/Text/Text.js

@@ -80,6 +80,7 @@ class PluginText extends react_1.default.PureComponent {
             return;
         }
         this.setState({ status: LoadStatus.Pending });
+        const onLoadComplete = this.props.onBeforeLoad();
         try {
             let htmlText = '';
             if (this.state.text && this.state.text.trim()) {
@@ -100,6 +101,7 @@ class PluginText extends react_1.default.PureComponent {
             }
             this.setState({ status: LoadStatus.Fail });
         }
+        onLoadComplete();
     }
     get withMarkdown() {
         return typeof this.props.apiHandler === 'function';

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

@@ -8,6 +8,7 @@ export interface PluginWidgetProps<T = StringParams> {
     params: T;
     state: ItemState;
     onStateAndParamsChange: (stateAndParams: ItemStateAndParams, options?: ItemStateAndParamsChangeOptions) => void;
+    onBeforeLoad: () => () => void;
     width: number;
     height: number;
     data: ConfigItem['data'];

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

@@ -18,6 +18,11 @@ interface DashKitDefaultProps {
         groups?: DashKitGroup[];
     }) => void;
     onDrop: (dropProps: ItemDropProps) => void;
+    onItemMountChange?: (item: ConfigItem, state: {
+        isAsync: boolean;
+        isMounted: boolean;
+    }) => void;
+    onItemRender?: (item: ConfigItem) => void;
     defaultGlobalParams: GlobalParams;
     globalParams: GlobalParams;
     itemsStateAndParams: ItemsStateAndParams;

package/build/esm/components/GridItem/GridItem.js

@@ -36,6 +36,7 @@ const windowFocusObserver = new WindowFocusObserver();
 class GridItem extends React.PureComponent {
     constructor() {
         super(...arguments);
+        this._isAsyncItem = false;
         this.state = {
             isFocused: false,
         };
@@ -54,6 +55,33 @@ class GridItem extends React.PureComponent {
                 this.controller = null;
             });
         };
+        this.onMountChange = (isMounted) => {
+            var _a, _b, _c, _d, _e, _f;
+            if (isMounted) {
+                this._inited = true;
+                (_b = (_a = this.props).onItemMountChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.item, {
+                    isAsync: this._isAsyncItem,
+                    isMounted: isMounted,
+                });
+                if (!this._isAsyncItem) {
+                    (_d = (_c = this.props).onItemRender) === null || _d === void 0 ? void 0 : _d.call(_c, this.props.item);
+                }
+            }
+            else {
+                (_f = (_e = this.props).onItemMountChange) === null || _f === void 0 ? void 0 : _f.call(_e, this.props.item, {
+                    isAsync: this._isAsyncItem,
+                    isMounted: isMounted,
+                });
+            }
+        };
+        this.onBeforeLoad = () => {
+            this._isAsyncItem = true;
+            return this.onLoad;
+        };
+        this.onLoad = () => {
+            var _a, _b;
+            (_b = (_a = this.props).onItemRender) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.item);
+        };
     }
     renderOverlay() {
         const { isPlaceholder } = this.props;
@@ -69,7 +97,7 @@ class GridItem extends React.PureComponent {
     render() {
         // из-за бага, что Grid Items unmounts при изменении static, isDraggable, isResaizable
         // https://github.com/STRML/react-grid-layout/issues/721
-        const { style, onMouseDown, onMouseUp, onTouchEnd, onTouchStart, children, className, isDragging, noOverlay, focusable, withCustomHandle, isPlaceholder, } = this.props;
+        const { style, onMouseDown, onMouseUp, onTouchEnd, onTouchStart, children, className, isDragging, noOverlay, focusable, withCustomHandle, isPlaceholder = false, } = this.props;
         const { editMode } = this.context;
         const width = Number.parseInt(style.width, 10);
         const height = Number.parseInt(style.height, 10);
@@ -94,7 +122,7 @@ class GridItem extends React.PureComponent {
             }
             : {})),
             React.createElement("div", { className: b('item', { editMode: editMode && !_editActive && !noOverlay }) },
-                React.createElement(Item, { id: this.props.id, item: this.props.item, shouldItemUpdate: !isDragging, width: width, height: height, transform: transform, isPlaceholder: isPlaceholder, adjustWidgetLayout: this.props.adjustWidgetLayout, layout: this.props.layout, forwardedPluginRef: this.props.forwardedPluginRef })),
+                React.createElement(Item, { id: this.props.id, item: this.props.item, shouldItemUpdate: !isDragging, width: width, height: height, transform: transform, isPlaceholder: isPlaceholder, adjustWidgetLayout: this.props.adjustWidgetLayout, layout: this.props.layout, forwardedPluginRef: this.props.forwardedPluginRef, onMountChange: this.onMountChange, onBeforeLoad: this.onBeforeLoad })),
             !noOverlay && this.renderOverlay(),
             preparedChildren));
     }

package/build/esm/components/GridLayout/GridLayout.js

@@ -284,7 +284,7 @@ class GridLayout extends React.PureComponent {
         return (React.createElement(GridItem, { key: id, id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName) }));
     }
     renderGroup(group, renderLayout, renderItems, offset = 0, groupGridProperties) {
-        const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, } = this.context;
+        const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, onItemMountChange, onItemRender, } = this.context;
         const { currentDraggingElement, draggedOverGroup } = this.state;
         const properties = groupGridProperties
             ? groupGridProperties(Object.assign({}, registerManager.gridLayout))
@@ -307,7 +307,7 @@ class GridLayout extends React.PureComponent {
             }
             : null), { draggableCancel: `.${OVERLAY_CONTROLS_CLASS_NAME}` }),
             renderItems.map((item, i) => {
-                return (React.createElement(GridItem, { forwardedPluginRef: this.getMemoForwardRefCallback(offset + i), key: item.id, id: item.id, item: item, layout: layout, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, noOverlay: noOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName) }));
+                return (React.createElement(GridItem, { forwardedPluginRef: this.getMemoForwardRefCallback(offset + i), key: item.id, id: item.id, item: item, layout: layout, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, noOverlay: noOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName), onItemMountChange: onItemMountChange, onItemRender: onItemRender }));
             }),
             this.renderTemporaryPlaceholder()));
     }

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

@@ -61,7 +61,9 @@ declare const _default: {
         height: PropTypes.Requireable<number>;
         transform: PropTypes.Requireable<string>;
         isPlaceholder: PropTypes.Requireable<boolean>;
+        onBeforeLoad: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
+        onMountChange: PropTypes.Requireable<(...args: any[]) => any>;
     };
     contextType: React.Context<any>;
 };

package/build/esm/components/Item/Item.js

@@ -5,9 +5,18 @@ import { cn } from '../../utils/cn';
 import './Item.css';
 const b = cn('dashkit-item');
 // TODO: getDerivedStateFromError и заглушка с ошибкой
-const Item = ({ registerManager, rendererProps, type, isPlaceholder, forwardedPluginRef }) => {
+const Item = ({ registerManager, rendererProps, type, isPlaceholder, forwardedPluginRef, onMountChange, }) => {
     var _a, _b;
-    if (!registerManager.check(type)) {
+    const isRegisteredType = registerManager.check(type);
+    React.useLayoutEffect(() => {
+        if (isRegisteredType && !isPlaceholder) {
+            onMountChange === null || onMountChange === void 0 ? void 0 : onMountChange(true);
+            return () => {
+                onMountChange === null || onMountChange === void 0 ? void 0 : onMountChange(false);
+            };
+        }
+    }, []);
+    if (!isRegisteredType) {
         console.warn(`type [${type}] не зарегистрирован`);
         return null;
     }
@@ -23,5 +32,7 @@ Item.propTypes = {
     registerManager: PropTypes.object,
     type: PropTypes.string,
     isPlaceholder: PropTypes.bool,
+    onMountChange: PropTypes.func,
+    onBeforeLoad: PropTypes.func,
 };
 export default prepareItem(Item);

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

@@ -61,7 +61,9 @@ export function prepareItem(Component: any): {
         height: PropTypes.Requireable<number>;
         transform: PropTypes.Requireable<string>;
         isPlaceholder: PropTypes.Requireable<boolean>;
+        onBeforeLoad: PropTypes.Requireable<(...args: any[]) => any>;
         forwardedPluginRef: PropTypes.Requireable<any>;
+        onMountChange: PropTypes.Requireable<(...args: any[]) => any>;
     };
     contextType: React.Context<any>;
 };

package/build/esm/hocs/prepareItem.js

@@ -11,7 +11,7 @@ export function prepareItem(Component) {
                 };
                 this._currentRenderProps = {};
                 this.getRenderProps = () => {
-                    const { id, width, height, item, adjustWidgetLayout, layout, isPlaceholder } = this.props;
+                    const { id, width, height, item, adjustWidgetLayout, layout, isPlaceholder, onBeforeLoad, } = this.props;
                     const { itemsState, itemsParams, registerManager, settings, context, editMode } = this.context;
                     const { data, defaults, namespace } = item;
                     const rendererProps = {
@@ -20,6 +20,7 @@ export function prepareItem(Component) {
                         params: itemsParams[id],
                         state: itemsState[id],
                         onStateAndParamsChange: this._onStateAndParamsChange,
+                        onBeforeLoad,
                         width,
                         height,
                         id,
@@ -51,10 +52,10 @@ export function prepareItem(Component) {
                 return true;
             }
             render() {
-                const { item, isPlaceholder } = this.props;
+                const { item, isPlaceholder, forwardedPluginRef, onMountChange } = this.props;
                 const { registerManager } = this.context;
                 const { type } = item;
-                return (React.createElement(Component, { forwardedPluginRef: this.props.forwardedPluginRef, rendererProps: this.getRenderProps(), registerManager: registerManager, type: type, isPlaceholder: isPlaceholder }));
+                return (React.createElement(Component, { forwardedPluginRef: forwardedPluginRef, rendererProps: this.getRenderProps(), registerManager: registerManager, type: type, isPlaceholder: isPlaceholder, onMountChange: onMountChange }));
             }
         },
         _a.propTypes = {
@@ -67,7 +68,9 @@ export function prepareItem(Component) {
             height: PropTypes.number,
             transform: PropTypes.string,
             isPlaceholder: PropTypes.bool,
+            onBeforeLoad: PropTypes.func,
             forwardedPluginRef: PropTypes.any,
+            onMountChange: PropTypes.func,
         },
         _a.contextType = DashKitContext,
         _a;

package/build/esm/hocs/withContext.js

@@ -317,6 +317,8 @@ function useMemoStateContext(props) {
         onItemStateAndParamsChange,
         onDrop,
         onDropDragOver,
+        onItemMountChange: props.onItemMountChange,
+        onItemRender: props.onItemRender,
         layoutChange: onLayoutChange,
         getItemsMeta,
         reloadItems,
@@ -344,6 +346,8 @@ function useMemoStateContext(props) {
         onDrop,
         onDropDragOver,
         onLayoutChange,
+        props.onItemMountChange,
+        props.onItemRender,
         getItemsMeta,
         reloadItems,
         memorizeOriginalLayout,

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

@@ -16,6 +16,7 @@ export interface PluginTextProps extends PluginWidgetProps {
     data: {
         text: string;
     } & PluginWidgetProps['data'];
+    onBeforeRender: () => () => void;
 }
 interface PluginTextState {
     htmlText: string;

package/build/esm/plugins/Text/Text.js

@@ -77,6 +77,7 @@ export class PluginText extends React.PureComponent {
             return;
         }
         this.setState({ status: LoadStatus.Pending });
+        const onLoadComplete = this.props.onBeforeLoad();
         try {
             let htmlText = '';
             if (this.state.text && this.state.text.trim()) {
@@ -97,6 +98,7 @@ export class PluginText extends React.PureComponent {
             }
             this.setState({ status: LoadStatus.Fail });
         }
+        onLoadComplete();
     }
     get withMarkdown() {
         return typeof this.props.apiHandler === 'function';

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

@@ -8,6 +8,7 @@ export interface PluginWidgetProps<T = StringParams> {
     params: T;
     state: ItemState;
     onStateAndParamsChange: (stateAndParams: ItemStateAndParams, options?: ItemStateAndParamsChangeOptions) => void;
+    onBeforeLoad: () => () => void;
     width: number;
     height: number;
     data: ConfigItem['data'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dashkit",
-  "version": "8.9.1",
+  "version": "8.10.0",
   "description": "Library for rendering dashboard grid layout",
   "license": "MIT",
   "repository": {