@gravity-ui/dashkit 10.0.0 → 10.1.0

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

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GroupLayout = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const constants_1 = require("../../constants/index.js");
+const context_1 = require("../../context/index.js");
+const GridItem_1 = tslib_1.__importDefault(require("../GridItem/GridItem.js"));
+const ReactGridLayout_1 = require("./ReactGridLayout.js");
+const utils_1 = require("./utils.js");
+function groupLayoutPropsAreEqual(prev, next) {
+    const needRerenderIfChanged = prev.group !== next.group ||
+        prev.layout !== next.layout ||
+        prev.offset !== next.offset ||
+        !(0, utils_1.shallowArrayEqual)(prev.renderItems, next.renderItems) ||
+        !(0, utils_1.shallowObjectEqual)(prev.properties, next.properties);
+    // Drag refs are stable and never trigger re-renders; only group-scoped state matters.
+    const needRerenderGroupScoped = prev.isDragCaptured !== next.isDragCaptured ||
+        prev.isAnyDragging !== next.isAnyDragging ||
+        prev.currentDraggingItemId !== next.currentDraggingItemId ||
+        prev.isAnyDraggedOut !== next.isAnyDraggedOut;
+    const hasTmpPlaceholderChanged = prev.temporaryPlaceholder !== next.temporaryPlaceholder;
+    return !needRerenderIfChanged && !needRerenderGroupScoped && !hasTmpPlaceholderChanged;
+}
+exports.GroupLayout = react_1.default.memo(function GroupLayout({ group, renderItems, offset, properties, compactType, callbacks, layout, temporaryPlaceholder, dragStateRef, sharedDragPositionRef, isDragCaptured, isAnyDragging, currentDraggingItemId, isAnyDraggedOut, adjustWidgetLayout, getMemoForwardRefCallback, }) {
+    const { editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, onItemMountChange, onItemRender, onItemFocus, onItemBlur, } = react_1.default.useContext(context_1.DashKitContext);
+    // Use group-specific noOverlay if it was explicitly set via groupGridProperties,
+    // otherwise fallback to the dashboard-level noOverlay from context.
+    const resolvedNoOverlay = 'noOverlay' in properties ? properties.noOverlay : noOverlay;
+    // Memoize items array; non-source groups have stable false/null drag props so React skips their subtrees.
+    const itemElements = react_1.default.useMemo(() => {
+        return renderItems.map((item, i) => {
+            const keyId = item.id;
+            const isDragging = isAnyDragging && keyId === currentDraggingItemId;
+            const isDraggedOut = isDragging && isAnyDraggedOut;
+            return (react_1.default.createElement(GridItem_1.default, { key: keyId, forwardedPluginRef: getMemoForwardRefCallback(offset + i), id: keyId, item: item, layout: layout, adjustWidgetLayout: adjustWidgetLayout, isDragging: isDragging, isDraggedOut: isDraggedOut || undefined, noOverlay: resolvedNoOverlay, focusable: focusable, withCustomHandle: Boolean(draggableHandleClassName), onItemMountChange: onItemMountChange, onItemRender: onItemRender, gridLayout: properties, onItemFocus: onItemFocus, onItemBlur: onItemBlur }));
+        });
+    }, [
+        renderItems,
+        isAnyDragging,
+        currentDraggingItemId,
+        isAnyDraggedOut,
+        offset,
+        layout,
+        adjustWidgetLayout,
+        resolvedNoOverlay,
+        focusable,
+        draggableHandleClassName,
+        onItemMountChange,
+        onItemRender,
+        properties,
+        onItemFocus,
+        onItemBlur,
+        getMemoForwardRefCallback,
+    ]);
+    return (react_1.default.createElement(ReactGridLayout_1.Layout, Object.assign({ key: `group_${group}`, isDraggable: editMode, isResizable: editMode }, properties, { compactType: compactType, layout: layout, draggableCancel: `.${constants_1.DRAGGABLE_CANCEL_CLASS_NAME}`, draggableHandle: draggableHandleClassName ? `.${draggableHandleClassName}` : undefined, onDragStart: callbacks.onDragStart, onDrag: callbacks.onDrag, onDragStop: callbacks.onDragStop, onResizeStart: callbacks.onResizeStart, onResize: callbacks.onResize, onResizeStop: callbacks.onResizeStop, onDragTargetRestore: callbacks.onDragTargetRestore, onDropDragOver: callbacks.onDropDragOver, onDrop: callbacks.onDrop, dragStateRef: dragStateRef, sharedDragPositionRef: sharedDragPositionRef, group: group, isDragCaptured: isDragCaptured, isDroppable: Boolean(outerDnDEnable) && editMode }),
+        itemElements,
+        temporaryPlaceholder));
+}, groupLayoutPropsAreEqual);
+//# sourceMappingURL=GroupLayout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GroupLayout.js","sourceRoot":"../../../../src","sources":["components/GridLayout/GroupLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {DRAGGABLE_CANCEL_CLASS_NAME} from '../../constants';\nimport {DashKitContext} from '../../context';\nimport type {ConfigItem, ConfigLayout} from '../../shared';\nimport type {PluginRef, PluginWidgetProps, ReactGridLayoutProps} from '../../typings';\nimport GridItem from '../GridItem/GridItem';\n\nimport {Layout} from './ReactGridLayout';\nimport type {GroupCallbacks} from './types';\nimport {shallowArrayEqual, shallowObjectEqual} from './utils';\n\nexport interface GroupLayoutProps {\n    group: string;\n    renderItems: ConfigItem[];\n    offset: number;\n\n    // Pre-computed by GridLayout.renderGroup (stable refs via getMemoGroupProps)\n    properties: Partial<ReactGridLayoutProps>;\n    compactType: 'vertical' | 'horizontal' | null | undefined;\n    callbacks: GroupCallbacks;\n    layout: ConfigLayout[];\n    temporaryPlaceholder: React.ReactNode;\n\n    // Refs read imperatively by DragOverLayout — no re-render on drag start.\n    isDragCaptured: boolean;\n    dragStateRef: React.MutableRefObject<{isDragging: boolean; sourceGroup: string | null}>;\n    sharedDragPositionRef: React.MutableRefObject<{offsetX: number; offsetY: number} | null>;\n\n    // Drag state scoped to this group only (always false/null for non-source groups)\n    isAnyDragging: boolean;\n    currentDraggingItemId: string | null;\n    isAnyDraggedOut: boolean;\n\n    // Stable instance method refs from GridLayout (arrow function class properties)\n    adjustWidgetLayout: PluginWidgetProps['adjustWidgetLayout'];\n    getMemoForwardRefCallback: (index: number) => (ref: PluginRef) => void;\n}\n\nfunction groupLayoutPropsAreEqual(prev: GroupLayoutProps, next: GroupLayoutProps): boolean {\n    const needRerenderIfChanged =\n        prev.group !== next.group ||\n        prev.layout !== next.layout ||\n        prev.offset !== next.offset ||\n        !shallowArrayEqual(prev.renderItems, next.renderItems) ||\n        !shallowObjectEqual(prev.properties, next.properties);\n\n    // Drag refs are stable and never trigger re-renders; only group-scoped state matters.\n    const needRerenderGroupScoped =\n        prev.isDragCaptured !== next.isDragCaptured ||\n        prev.isAnyDragging !== next.isAnyDragging ||\n        prev.currentDraggingItemId !== next.currentDraggingItemId ||\n        prev.isAnyDraggedOut !== next.isAnyDraggedOut;\n\n    const hasTmpPlaceholderChanged = prev.temporaryPlaceholder !== next.temporaryPlaceholder;\n\n    return !needRerenderIfChanged && !needRerenderGroupScoped && !hasTmpPlaceholderChanged;\n}\n\nexport const GroupLayout = React.memo(function GroupLayout({\n    group,\n    renderItems,\n    offset,\n    properties,\n    compactType,\n    callbacks,\n    layout,\n    temporaryPlaceholder,\n    dragStateRef,\n    sharedDragPositionRef,\n    isDragCaptured,\n    isAnyDragging,\n    currentDraggingItemId,\n    isAnyDraggedOut,\n    adjustWidgetLayout,\n    getMemoForwardRefCallback,\n}: GroupLayoutProps) {\n    const {\n        editMode,\n        noOverlay,\n        focusable,\n        draggableHandleClassName,\n        outerDnDEnable,\n        onItemMountChange,\n        onItemRender,\n        onItemFocus,\n        onItemBlur,\n    } = React.useContext(DashKitContext);\n\n    // Use group-specific noOverlay if it was explicitly set via groupGridProperties,\n    // otherwise fallback to the dashboard-level noOverlay from context.\n    const resolvedNoOverlay = 'noOverlay' in properties ? properties.noOverlay : noOverlay;\n\n    // Memoize items array; non-source groups have stable false/null drag props so React skips their subtrees.\n    const itemElements = React.useMemo(() => {\n        return renderItems.map((item, i) => {\n            const keyId = item.id;\n\n            const isDragging = isAnyDragging && keyId === currentDraggingItemId;\n            const isDraggedOut = isDragging && isAnyDraggedOut;\n\n            return (\n                <GridItem\n                    key={keyId}\n                    forwardedPluginRef={getMemoForwardRefCallback(offset + i)}\n                    id={keyId}\n                    item={item}\n                    layout={layout}\n                    adjustWidgetLayout={adjustWidgetLayout}\n                    isDragging={isDragging}\n                    isDraggedOut={isDraggedOut || undefined}\n                    noOverlay={resolvedNoOverlay}\n                    focusable={focusable}\n                    withCustomHandle={Boolean(draggableHandleClassName)}\n                    onItemMountChange={onItemMountChange}\n                    onItemRender={onItemRender}\n                    gridLayout={properties}\n                    onItemFocus={onItemFocus}\n                    onItemBlur={onItemBlur}\n                />\n            );\n        });\n    }, [\n        renderItems,\n        isAnyDragging,\n        currentDraggingItemId,\n        isAnyDraggedOut,\n        offset,\n        layout,\n        adjustWidgetLayout,\n        resolvedNoOverlay,\n        focusable,\n        draggableHandleClassName,\n        onItemMountChange,\n        onItemRender,\n        properties,\n        onItemFocus,\n        onItemBlur,\n        getMemoForwardRefCallback,\n    ]);\n\n    return (\n        <Layout\n            key={`group_${group}`}\n            isDraggable={editMode}\n            isResizable={editMode}\n            {...properties}\n            compactType={compactType}\n            layout={layout}\n            draggableCancel={`.${DRAGGABLE_CANCEL_CLASS_NAME}`}\n            draggableHandle={draggableHandleClassName ? `.${draggableHandleClassName}` : undefined}\n            onDragStart={callbacks.onDragStart}\n            onDrag={callbacks.onDrag}\n            onDragStop={callbacks.onDragStop}\n            onResizeStart={callbacks.onResizeStart}\n            onResize={callbacks.onResize}\n            onResizeStop={callbacks.onResizeStop}\n            onDragTargetRestore={callbacks.onDragTargetRestore}\n            onDropDragOver={callbacks.onDropDragOver}\n            onDrop={callbacks.onDrop}\n            dragStateRef={dragStateRef}\n            sharedDragPositionRef={sharedDragPositionRef}\n            group={group}\n            isDragCaptured={isDragCaptured}\n            isDroppable={Boolean(outerDnDEnable) && editMode}\n        >\n            {itemElements}\n            {temporaryPlaceholder}\n        </Layout>\n    );\n}, groupLayoutPropsAreEqual);\n"]}

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

@@ -7,8 +7,13 @@ type SharedDragPosition = {
 export declare const Layout: React.ComponentClass<ReactGridLayout.ReactGridLayoutProps & {
     innerRef?: React.Ref<HTMLDivElement>;
     isDragCaptured?: boolean;
-    hasSharedDragItem?: boolean;
-    sharedDragPosition?: SharedDragPosition;
+    dragStateRef?: React.MutableRefObject<{
+        isDragging: boolean;
+        sourceGroup: string | null;
+    }>;
+    sharedDragPositionRef?: React.MutableRefObject<SharedDragPosition | null>;
+    group?: string;
     onDragTargetRestore?: () => void;
+    transformScaleRef?: React.MutableRefObject<number>;
 } & ReactGridLayout.WidthProviderProps, any>;
 export {};

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

@@ -85,10 +85,17 @@ class DragOverLayout extends react_grid_layout_1.default {
                 this.parentOnDragStop(i, x, y, sintEv);
             }
         };
+        // Returns true when another group's item is being dragged over this grid.
+        // Reads from the ref directly — no re-render required to stay current.
+        this.isSharedDragTarget = () => {
+            var _a;
+            const drag = (_a = this.props.dragStateRef) === null || _a === void 0 ? void 0 : _a.current;
+            return Boolean((drag === null || drag === void 0 ? void 0 : drag.isDragging) && (drag === null || drag === void 0 ? void 0 : drag.sourceGroup) !== this.props.group);
+        };
         // Proxy mouse events -> drag methods for dnd between groups
         this.mouseEnterHandler = (e) => {
             var _a, _b;
-            if (this.props.hasSharedDragItem) {
+            if (this.isSharedDragTarget()) {
                 // @ts-expect-error - onDragEnter is a protected method in parent class
                 this.onDragEnter(e);
             }
@@ -98,14 +105,14 @@ class DragOverLayout extends react_grid_layout_1.default {
         };
         this.mouseLeaveHandler = (e) => {
             var _a, _b;
-            if (this.props.hasSharedDragItem) {
+            if (this.isSharedDragTarget()) {
                 // @ts-expect-error - onDragLeave is a protected method in parent class
                 this.onDragLeave(e);
                 (_b = (_a = this.props).onDragTargetRestore) === null || _b === void 0 ? void 0 : _b.call(_a);
             }
         };
         this.mouseMoveHandler = (e) => {
-            if (this.props.hasSharedDragItem) {
+            if (this.isSharedDragTarget()) {
                 if (!e.nativeEvent) {
                     // Emulate nativeEvent for firefox
                     const target = this.getInnerElement() || e.target;
@@ -121,7 +128,7 @@ class DragOverLayout extends react_grid_layout_1.default {
         };
         this.mouseUpHandler = (e) => {
             var _a, _b;
-            if (this.props.hasSharedDragItem) {
+            if (this.isSharedDragTarget()) {
                 e.preventDefault();
                 const { droppingItem } = this.props;
                 const { layout } = this.state;
@@ -187,8 +194,9 @@ class DragOverLayout extends react_grid_layout_1.default {
         return innerRef && isRefObject(innerRef) && innerRef.current ? innerRef.current : null;
     }
     calculateDroppingPosition(itemProps) {
+        var _a;
         const { containerWidth, cols, w, h, rowHeight, margin, transformScale, droppingPosition } = itemProps;
-        const { sharedDragPosition } = this.props;
+        const sharedDragPosition = (_a = this.props.sharedDragPositionRef) === null || _a === void 0 ? void 0 : _a.current;
         let offsetX, offsetY;
         if (sharedDragPosition) {
             offsetX = sharedDragPosition.offsetX;
@@ -211,15 +219,20 @@ class DragOverLayout extends react_grid_layout_1.default {
         if (!gridItem) {
             return gridItem;
         }
+        // Lazy proxy for transformScaleRef so react-draggable reads fresh scale without re-render.
+        const { transformScaleRef } = this.props;
+        const lazyScale = transformScaleRef
+            ? { valueOf: () => transformScaleRef.current }
+            : undefined;
         if (isDroppingItem) {
             // React.cloneElement is just cleaner then copy-paste whole processGridItem method
-            return react_1.default.cloneElement(gridItem, {
+            return react_1.default.cloneElement(gridItem, Object.assign(Object.assign({}, (lazyScale !== undefined && { transformScale: lazyScale })), { 
                 // hiding preview if dragging shared item
-                style: this.props.hasSharedDragItem
-                    ? Object.assign(Object.assign({}, gridItem.props.style), { opacity: 0 }) : gridItem.props.style,
-                className: `${constants_1.OVERLAY_CLASS_NAME} ${constants_1.DROPPING_ELEMENT_CLASS_NAME}`,
-                droppingPosition: this.calculateDroppingPosition(gridItem.props),
-            });
+                style: this.isSharedDragTarget()
+                    ? Object.assign(Object.assign({}, gridItem.props.style), { opacity: 0 }) : gridItem.props.style, className: `${constants_1.OVERLAY_CLASS_NAME} ${constants_1.DROPPING_ELEMENT_CLASS_NAME}`, droppingPosition: this.calculateDroppingPosition(gridItem.props) }));
+        }
+        if (lazyScale !== undefined) {
+            return react_1.default.cloneElement(gridItem, { transformScale: lazyScale });
         }
         return gridItem;
     }

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

@@ -1 +1 @@
-{"version":3,"file":"ReactGridLayout.js","sourceRoot":"../../../../src","sources":["components/GridLayout/ReactGridLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {Layout as RGLLayout} from 'react-grid-layout';\n// @ts-expect-error - utils is not exported in type definitions\nimport ReactGridLayout, {WidthProvider, utils} from 'react-grid-layout';\n\nimport {DROPPING_ELEMENT_CLASS_NAME, OVERLAY_CLASS_NAME} from '../../constants';\n\nconst isRefObject = (\n    value: React.Ref<HTMLDivElement>,\n): value is React.RefObject<HTMLDivElement> => {\n    return (\n        typeof value === 'object' &&\n        value !== null &&\n        'current' in value &&\n        typeof value.current === 'object'\n    );\n};\n\ntype SharedDragPosition = {\n    offsetX: number;\n    offsetY: number;\n};\n\ntype DragOverLayoutProps = ReactGridLayout.ReactGridLayoutProps & {\n    innerRef?: React.Ref<HTMLDivElement>;\n    isDragCaptured?: boolean;\n    hasSharedDragItem?: boolean;\n    sharedDragPosition?: SharedDragPosition;\n    onDragTargetRestore?: () => void;\n};\n\ntype DragOverLayoutState = {\n    layout: RGLLayout[];\n    activeDrag: RGLLayout | null;\n};\n\ntype RGLLayoutWithPlaceholder = RGLLayout & {placeholder?: boolean};\n\ntype OnDragMethod = (\n    i: string,\n    x: number,\n    y: number,\n    sintEv: {e: Event; node: HTMLElement},\n) => void;\n\nclass DragOverLayout extends ReactGridLayout {\n    // @ts-expect-error - TypeScript doesn't allow direct property redeclaration in extending classes. We need to narrow the props type from ReactGridLayoutProps to DragOverLayoutProps for type safety in our custom methods\n    props: DragOverLayoutProps;\n    // @ts-expect-error - TypeScript doesn't allow direct property redeclaration in extending classes. State is initialized by parent constructor\n    state: DragOverLayoutState;\n\n    parentOnDrag: OnDragMethod;\n    parentOnDragStop: OnDragMethod;\n    _savedDraggedOutLayout: RGLLayout[] | null = null;\n\n    constructor(props: DragOverLayoutProps, context?: unknown) {\n        super(props, context);\n\n        // @ts-expect-error - onDrag is a protected method in parent class\n        this.parentOnDrag = this.onDrag;\n        // @ts-expect-error - assigning custom method to parent's onDrag\n        this.onDrag = this.extendedOnDrag;\n\n        // @ts-expect-error - onDragStop is a protected method in parent class\n        this.parentOnDragStop = this.onDragStop;\n        // @ts-expect-error - assigning custom method to parent's onDragStop\n        this.onDragStop = this.extendedOnDragStop;\n    }\n\n    componentDidMount(): void {\n        super.componentDidMount?.();\n\n        // If cursor is moved out of the window there is a bug\n        // which leaves placeholder element in grid, this action needed to reset this state\n        window.addEventListener('dragend', this.resetExternalPlaceholder);\n        const innerElement = this.getInnerElement();\n\n        if (innerElement) {\n            innerElement.addEventListener('mouseup', this.mouseUpHandler);\n            innerElement.addEventListener('mouseenter', this.mouseEnterHandler);\n            innerElement.addEventListener('mouseleave', this.mouseLeaveHandler);\n            innerElement.addEventListener('mousemove', this.mouseMoveHandler);\n        }\n    }\n\n    componentWillUnmount(): void {\n        window.removeEventListener('dragend', this.resetExternalPlaceholder);\n        const innerElement = this.getInnerElement();\n\n        if (innerElement) {\n            innerElement.removeEventListener('mouseup', this.mouseUpHandler);\n            innerElement.removeEventListener('mouseenter', this.mouseEnterHandler);\n            innerElement.removeEventListener('mouseleave', this.mouseLeaveHandler);\n            innerElement.removeEventListener('mousemove', this.mouseMoveHandler);\n        }\n    }\n\n    // react-grid-layout doens't calculate it's height when last element is removed\n    // and just keeps the previous value\n    // so for autosize to work in that case we are resetting it's height value\n    containerHeight(): string | undefined {\n        if (this.props.autoSize && this.state.layout.length === 0) {\n            return;\n        }\n\n        // eslint-disable-next-line consistent-return\n        // @ts-expect-error - containerHeight is a protected method in parent class\n        return super.containerHeight();\n    }\n\n    // innerRef is passed by WithProvider without this wrapper there are only\n    // * findDOMNode - deprecated\n    // * rewrite whole ReactGridLayout.render method\n    // so in that case don't try to use this class on it's own\n    // or pass innerRef: React.MutableRef as it's not optional prop\n    getInnerElement(): HTMLDivElement | null {\n        const {innerRef} = this.props;\n\n        return innerRef && isRefObject(innerRef) && innerRef.current ? innerRef.current : null;\n    }\n\n    // Reset placeholder when item dragged from outside\n    resetExternalPlaceholder = (): void => {\n        // @ts-expect-error - dragEnterCounter is an internal property of parent class\n        if (this.dragEnterCounter) {\n            // @ts-expect-error - dragEnterCounter is an internal property of parent class\n            this.dragEnterCounter = 0;\n            // @ts-expect-error - removeDroppingPlaceholder is a protected method in parent class\n            this.removeDroppingPlaceholder();\n        }\n    };\n\n    // Hide placeholder when element is dragged out\n    hideLocalPlaceholder = (i: string): RGLLayout[] => {\n        const {layout} = this.state;\n        const {cols} = this.props;\n        const savedLayout = layout.map((item) => ({...item}));\n\n        let hiddenElement: RGLLayout | undefined;\n        const newLayout = utils.compact(\n            layout.filter((item) => {\n                if (item.i === i) {\n                    hiddenElement = item;\n                    return false;\n                }\n\n                return true;\n            }),\n            utils.compactType(this.props),\n            cols,\n        );\n\n        if (hiddenElement) {\n            newLayout.push(hiddenElement);\n        }\n\n        this.setState({\n            activeDrag: null,\n            layout: newLayout,\n        });\n\n        return savedLayout;\n    };\n\n    extendedOnDrag = (\n        i: string,\n        x: number,\n        y: number,\n        sintEv: {e: Event; node: HTMLElement},\n    ): void => {\n        if (this.props.isDragCaptured) {\n            if (!this._savedDraggedOutLayout) {\n                this._savedDraggedOutLayout = this.hideLocalPlaceholder(i);\n            }\n\n            return;\n        }\n\n        this._savedDraggedOutLayout = null;\n        // parent onDrag will show new placeholder again\n        this.parentOnDrag(i, x, y, sintEv);\n    };\n\n    extendedOnDragStop = (\n        i: string,\n        x: number,\n        y: number,\n        sintEv: {e: Event; node: HTMLElement},\n    ): void => {\n        // Restoring layout if item was dropped outside of the grid\n        if (this._savedDraggedOutLayout) {\n            const savedLayout = this._savedDraggedOutLayout;\n            const l = utils.getLayoutItem(savedLayout, i);\n\n            // Create placeholder (display only)\n            const placeholder: RGLLayoutWithPlaceholder = {\n                w: l.w,\n                h: l.h,\n                x: l.x,\n                y: l.y,\n                placeholder: true,\n                i: i,\n            };\n\n            this.setState(\n                {\n                    layout: savedLayout,\n                    activeDrag: placeholder,\n                },\n                () => {\n                    this.parentOnDragStop(i, x, y, sintEv);\n                },\n            );\n\n            this._savedDraggedOutLayout = null;\n        } else {\n            this.parentOnDragStop(i, x, y, sintEv);\n        }\n    };\n\n    // Proxy mouse events -> drag methods for dnd between groups\n    mouseEnterHandler = (e: MouseEvent): void => {\n        if (this.props.hasSharedDragItem) {\n            // @ts-expect-error - onDragEnter is a protected method in parent class\n            this.onDragEnter(e);\n        } else if (this.props.isDragCaptured) {\n            this.props.onDragTargetRestore?.();\n        }\n    };\n\n    mouseLeaveHandler = (e: MouseEvent): void => {\n        if (this.props.hasSharedDragItem) {\n            // @ts-expect-error - onDragLeave is a protected method in parent class\n            this.onDragLeave(e);\n            this.props.onDragTargetRestore?.();\n        }\n    };\n\n    mouseMoveHandler = (e: MouseEvent): void => {\n        if (this.props.hasSharedDragItem) {\n            if (!(e as MouseEvent & {nativeEvent?: MouseEvent}).nativeEvent) {\n                // Emulate nativeEvent for firefox\n                const target = this.getInnerElement() || (e.target as HTMLElement);\n\n                (e as MouseEvent & {nativeEvent: Partial<MouseEvent>}).nativeEvent = {\n                    clientX: e.clientX,\n                    clientY: e.clientY,\n                    target,\n                };\n            }\n\n            // @ts-expect-error - onDragOver is a protected method in parent class\n            this.onDragOver(e);\n        }\n    };\n\n    mouseUpHandler = (e: MouseEvent): void => {\n        if (this.props.hasSharedDragItem) {\n            e.preventDefault();\n            const {droppingItem} = this.props;\n            const {layout} = this.state;\n            const item = layout.find((l) => l.i === droppingItem?.i);\n\n            // reset dragEnter counter on drop\n            this.resetExternalPlaceholder();\n\n            if (item) {\n                this.props.onDrop?.(layout, item, e);\n            }\n        }\n    };\n\n    calculateDroppingPosition(itemProps: {\n        containerWidth: number;\n        cols: number;\n        w: number;\n        h: number;\n        rowHeight: number;\n        margin: [number, number];\n        transformScale: number;\n        droppingPosition: {left: number; top: number};\n    }): {left: number; top: number} {\n        const {containerWidth, cols, w, h, rowHeight, margin, transformScale, droppingPosition} =\n            itemProps;\n        const {sharedDragPosition} = this.props;\n\n        let offsetX: number, offsetY: number;\n\n        if (sharedDragPosition) {\n            offsetX = sharedDragPosition.offsetX;\n            offsetY = sharedDragPosition.offsetY;\n        } else {\n            offsetX = (((containerWidth / cols) * w) / 2 || 0) * transformScale;\n            offsetY = ((h * rowHeight + (h - 1) * margin[1]) / 2 || 0) * transformScale;\n        }\n\n        return {\n            ...droppingPosition,\n            left: droppingPosition.left - offsetX,\n            top: droppingPosition.top - offsetY,\n        };\n    }\n\n    // Drop item from outside gets 0,0 droppingPosition\n    // centering cursor on newly creted grid item\n    // And cause grid-layout using it's own GridItem to make it look\n    // like overlay adding className\n    processGridItem(\n        child: React.ReactElement,\n        isDroppingItem?: boolean,\n    ): React.ReactElement | undefined {\n        // @ts-expect-error - processGridItem is a protected method in parent class\n        const gridItem = super.processGridItem?.(child, isDroppingItem);\n\n        if (!gridItem) {\n            return gridItem;\n        }\n\n        if (isDroppingItem) {\n            // React.cloneElement is just cleaner then copy-paste whole processGridItem method\n            return React.cloneElement(gridItem, {\n                // hiding preview if dragging shared item\n                style: this.props.hasSharedDragItem\n                    ? {...gridItem.props.style, opacity: 0}\n                    : gridItem.props.style,\n                className: `${OVERLAY_CLASS_NAME} ${DROPPING_ELEMENT_CLASS_NAME}`,\n                droppingPosition: this.calculateDroppingPosition(gridItem.props),\n            });\n        }\n\n        return gridItem;\n    }\n}\n\n// eslint-disable-next-line new-cap\nexport const Layout = WidthProvider<DragOverLayoutProps>(DragOverLayout);\n"]}
+{"version":3,"file":"ReactGridLayout.js","sourceRoot":"../../../../src","sources":["components/GridLayout/ReactGridLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {Layout as RGLLayout} from 'react-grid-layout';\n// @ts-expect-error - utils is not exported in type definitions\nimport ReactGridLayout, {WidthProvider, utils} from 'react-grid-layout';\n\nimport {DROPPING_ELEMENT_CLASS_NAME, OVERLAY_CLASS_NAME} from '../../constants';\n\nconst isRefObject = (\n    value: React.Ref<HTMLDivElement>,\n): value is React.RefObject<HTMLDivElement> => {\n    return (\n        typeof value === 'object' &&\n        value !== null &&\n        'current' in value &&\n        typeof value.current === 'object'\n    );\n};\n\ntype SharedDragPosition = {\n    offsetX: number;\n    offsetY: number;\n};\n\ntype DragOverLayoutProps = ReactGridLayout.ReactGridLayoutProps & {\n    innerRef?: React.Ref<HTMLDivElement>;\n    isDragCaptured?: boolean;\n    dragStateRef?: React.MutableRefObject<{isDragging: boolean; sourceGroup: string | null}>;\n    sharedDragPositionRef?: React.MutableRefObject<SharedDragPosition | null>;\n    group?: string;\n    onDragTargetRestore?: () => void;\n    transformScaleRef?: React.MutableRefObject<number>;\n};\n\ntype DragOverLayoutState = {\n    layout: RGLLayout[];\n    activeDrag: RGLLayout | null;\n};\n\ntype RGLLayoutWithPlaceholder = RGLLayout & {placeholder?: boolean};\n\ntype OnDragMethod = (\n    i: string,\n    x: number,\n    y: number,\n    sintEv: {e: Event; node: HTMLElement},\n) => void;\n\nclass DragOverLayout extends ReactGridLayout {\n    // @ts-expect-error - TypeScript doesn't allow direct property redeclaration in extending classes. We need to narrow the props type from ReactGridLayoutProps to DragOverLayoutProps for type safety in our custom methods\n    props: DragOverLayoutProps;\n    // @ts-expect-error - TypeScript doesn't allow direct property redeclaration in extending classes. State is initialized by parent constructor\n    state: DragOverLayoutState;\n\n    parentOnDrag: OnDragMethod;\n    parentOnDragStop: OnDragMethod;\n    _savedDraggedOutLayout: RGLLayout[] | null = null;\n\n    constructor(props: DragOverLayoutProps, context?: unknown) {\n        super(props, context);\n\n        // @ts-expect-error - onDrag is a protected method in parent class\n        this.parentOnDrag = this.onDrag;\n        // @ts-expect-error - assigning custom method to parent's onDrag\n        this.onDrag = this.extendedOnDrag;\n\n        // @ts-expect-error - onDragStop is a protected method in parent class\n        this.parentOnDragStop = this.onDragStop;\n        // @ts-expect-error - assigning custom method to parent's onDragStop\n        this.onDragStop = this.extendedOnDragStop;\n    }\n\n    componentDidMount(): void {\n        super.componentDidMount?.();\n\n        // If cursor is moved out of the window there is a bug\n        // which leaves placeholder element in grid, this action needed to reset this state\n        window.addEventListener('dragend', this.resetExternalPlaceholder);\n        const innerElement = this.getInnerElement();\n\n        if (innerElement) {\n            innerElement.addEventListener('mouseup', this.mouseUpHandler);\n            innerElement.addEventListener('mouseenter', this.mouseEnterHandler);\n            innerElement.addEventListener('mouseleave', this.mouseLeaveHandler);\n            innerElement.addEventListener('mousemove', this.mouseMoveHandler);\n        }\n    }\n\n    componentWillUnmount(): void {\n        window.removeEventListener('dragend', this.resetExternalPlaceholder);\n        const innerElement = this.getInnerElement();\n\n        if (innerElement) {\n            innerElement.removeEventListener('mouseup', this.mouseUpHandler);\n            innerElement.removeEventListener('mouseenter', this.mouseEnterHandler);\n            innerElement.removeEventListener('mouseleave', this.mouseLeaveHandler);\n            innerElement.removeEventListener('mousemove', this.mouseMoveHandler);\n        }\n    }\n\n    // react-grid-layout doens't calculate it's height when last element is removed\n    // and just keeps the previous value\n    // so for autosize to work in that case we are resetting it's height value\n    containerHeight(): string | undefined {\n        if (this.props.autoSize && this.state.layout.length === 0) {\n            return;\n        }\n\n        // eslint-disable-next-line consistent-return\n        // @ts-expect-error - containerHeight is a protected method in parent class\n        return super.containerHeight();\n    }\n\n    // innerRef is passed by WithProvider without this wrapper there are only\n    // * findDOMNode - deprecated\n    // * rewrite whole ReactGridLayout.render method\n    // so in that case don't try to use this class on it's own\n    // or pass innerRef: React.MutableRef as it's not optional prop\n    getInnerElement(): HTMLDivElement | null {\n        const {innerRef} = this.props;\n\n        return innerRef && isRefObject(innerRef) && innerRef.current ? innerRef.current : null;\n    }\n\n    // Reset placeholder when item dragged from outside\n    resetExternalPlaceholder = (): void => {\n        // @ts-expect-error - dragEnterCounter is an internal property of parent class\n        if (this.dragEnterCounter) {\n            // @ts-expect-error - dragEnterCounter is an internal property of parent class\n            this.dragEnterCounter = 0;\n            // @ts-expect-error - removeDroppingPlaceholder is a protected method in parent class\n            this.removeDroppingPlaceholder();\n        }\n    };\n\n    // Hide placeholder when element is dragged out\n    hideLocalPlaceholder = (i: string): RGLLayout[] => {\n        const {layout} = this.state;\n        const {cols} = this.props;\n        const savedLayout = layout.map((item) => ({...item}));\n\n        let hiddenElement: RGLLayout | undefined;\n        const newLayout = utils.compact(\n            layout.filter((item) => {\n                if (item.i === i) {\n                    hiddenElement = item;\n                    return false;\n                }\n\n                return true;\n            }),\n            utils.compactType(this.props),\n            cols,\n        );\n\n        if (hiddenElement) {\n            newLayout.push(hiddenElement);\n        }\n\n        this.setState({\n            activeDrag: null,\n            layout: newLayout,\n        });\n\n        return savedLayout;\n    };\n\n    extendedOnDrag = (\n        i: string,\n        x: number,\n        y: number,\n        sintEv: {e: Event; node: HTMLElement},\n    ): void => {\n        if (this.props.isDragCaptured) {\n            if (!this._savedDraggedOutLayout) {\n                this._savedDraggedOutLayout = this.hideLocalPlaceholder(i);\n            }\n\n            return;\n        }\n\n        this._savedDraggedOutLayout = null;\n        // parent onDrag will show new placeholder again\n        this.parentOnDrag(i, x, y, sintEv);\n    };\n\n    extendedOnDragStop = (\n        i: string,\n        x: number,\n        y: number,\n        sintEv: {e: Event; node: HTMLElement},\n    ): void => {\n        // Restoring layout if item was dropped outside of the grid\n        if (this._savedDraggedOutLayout) {\n            const savedLayout = this._savedDraggedOutLayout;\n            const l = utils.getLayoutItem(savedLayout, i);\n\n            // Create placeholder (display only)\n            const placeholder: RGLLayoutWithPlaceholder = {\n                w: l.w,\n                h: l.h,\n                x: l.x,\n                y: l.y,\n                placeholder: true,\n                i: i,\n            };\n\n            this.setState(\n                {\n                    layout: savedLayout,\n                    activeDrag: placeholder,\n                },\n                () => {\n                    this.parentOnDragStop(i, x, y, sintEv);\n                },\n            );\n\n            this._savedDraggedOutLayout = null;\n        } else {\n            this.parentOnDragStop(i, x, y, sintEv);\n        }\n    };\n\n    // Returns true when another group's item is being dragged over this grid.\n    // Reads from the ref directly — no re-render required to stay current.\n    isSharedDragTarget = (): boolean => {\n        const drag = this.props.dragStateRef?.current;\n        return Boolean(drag?.isDragging && drag?.sourceGroup !== this.props.group);\n    };\n\n    // Proxy mouse events -> drag methods for dnd between groups\n    mouseEnterHandler = (e: MouseEvent): void => {\n        if (this.isSharedDragTarget()) {\n            // @ts-expect-error - onDragEnter is a protected method in parent class\n            this.onDragEnter(e);\n        } else if (this.props.isDragCaptured) {\n            this.props.onDragTargetRestore?.();\n        }\n    };\n\n    mouseLeaveHandler = (e: MouseEvent): void => {\n        if (this.isSharedDragTarget()) {\n            // @ts-expect-error - onDragLeave is a protected method in parent class\n            this.onDragLeave(e);\n            this.props.onDragTargetRestore?.();\n        }\n    };\n\n    mouseMoveHandler = (e: MouseEvent): void => {\n        if (this.isSharedDragTarget()) {\n            if (!(e as MouseEvent & {nativeEvent?: MouseEvent}).nativeEvent) {\n                // Emulate nativeEvent for firefox\n                const target = this.getInnerElement() || (e.target as HTMLElement);\n\n                (e as MouseEvent & {nativeEvent: Partial<MouseEvent>}).nativeEvent = {\n                    clientX: e.clientX,\n                    clientY: e.clientY,\n                    target,\n                };\n            }\n\n            // @ts-expect-error - onDragOver is a protected method in parent class\n            this.onDragOver(e);\n        }\n    };\n\n    mouseUpHandler = (e: MouseEvent): void => {\n        if (this.isSharedDragTarget()) {\n            e.preventDefault();\n            const {droppingItem} = this.props;\n            const {layout} = this.state;\n            const item = layout.find((l) => l.i === droppingItem?.i);\n\n            // reset dragEnter counter on drop\n            this.resetExternalPlaceholder();\n\n            if (item) {\n                this.props.onDrop?.(layout, item, e);\n            }\n        }\n    };\n\n    calculateDroppingPosition(itemProps: {\n        containerWidth: number;\n        cols: number;\n        w: number;\n        h: number;\n        rowHeight: number;\n        margin: [number, number];\n        transformScale: number;\n        droppingPosition: {left: number; top: number};\n    }): {left: number; top: number} {\n        const {containerWidth, cols, w, h, rowHeight, margin, transformScale, droppingPosition} =\n            itemProps;\n        const sharedDragPosition = this.props.sharedDragPositionRef?.current;\n\n        let offsetX: number, offsetY: number;\n\n        if (sharedDragPosition) {\n            offsetX = sharedDragPosition.offsetX;\n            offsetY = sharedDragPosition.offsetY;\n        } else {\n            offsetX = (((containerWidth / cols) * w) / 2 || 0) * transformScale;\n            offsetY = ((h * rowHeight + (h - 1) * margin[1]) / 2 || 0) * transformScale;\n        }\n\n        return {\n            ...droppingPosition,\n            left: droppingPosition.left - offsetX,\n            top: droppingPosition.top - offsetY,\n        };\n    }\n\n    // Drop item from outside gets 0,0 droppingPosition\n    // centering cursor on newly creted grid item\n    // And cause grid-layout using it's own GridItem to make it look\n    // like overlay adding className\n    processGridItem(\n        child: React.ReactElement,\n        isDroppingItem?: boolean,\n    ): React.ReactElement | undefined {\n        // @ts-expect-error - processGridItem is a protected method in parent class\n        const gridItem = super.processGridItem?.(child, isDroppingItem);\n\n        if (!gridItem) {\n            return gridItem;\n        }\n\n        // Lazy proxy for transformScaleRef so react-draggable reads fresh scale without re-render.\n        const {transformScaleRef} = this.props;\n        const lazyScale = transformScaleRef\n            ? ({valueOf: () => transformScaleRef.current} as unknown as number)\n            : undefined;\n\n        if (isDroppingItem) {\n            // React.cloneElement is just cleaner then copy-paste whole processGridItem method\n            return React.cloneElement(gridItem, {\n                ...(lazyScale !== undefined && {transformScale: lazyScale}),\n                // hiding preview if dragging shared item\n                style: this.isSharedDragTarget()\n                    ? {...gridItem.props.style, opacity: 0}\n                    : gridItem.props.style,\n                className: `${OVERLAY_CLASS_NAME} ${DROPPING_ELEMENT_CLASS_NAME}`,\n                droppingPosition: this.calculateDroppingPosition(gridItem.props),\n            });\n        }\n\n        if (lazyScale !== undefined) {\n            return React.cloneElement(gridItem, {transformScale: lazyScale});\n        }\n\n        return gridItem;\n    }\n}\n\n// eslint-disable-next-line new-cap\nexport const Layout = WidthProvider<DragOverLayoutProps>(DragOverLayout);\n"]}

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

@@ -0,0 +1,2 @@
+export declare function shallowArrayEqual<T>(a: T[], b: T[]): boolean;
+export declare function shallowObjectEqual<T extends object>(a: T, b: T): boolean;

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

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.shallowArrayEqual = shallowArrayEqual;
+exports.shallowObjectEqual = shallowObjectEqual;
+function shallowArrayEqual(a, b) {
+    if (a === b) {
+        return true;
+    }
+    if (a.length !== b.length) {
+        return false;
+    }
+    return a.every((item, i) => item === b[i]);
+}
+function shallowObjectEqual(a, b) {
+    if (a === b) {
+        return true;
+    }
+    const keysA = Object.keys(a);
+    const keysB = Object.keys(b);
+    if (keysA.length !== keysB.length) {
+        return false;
+    }
+    return keysA.every((key) => a[key] === b[key]);
+}
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../src","sources":["components/GridLayout/utils.tsx"],"names":[],"mappings":";;AAAA,8CAQC;AAED,gDAUC;AApBD,SAAgB,iBAAiB,CAAI,CAAM,EAAE,CAAM;IAC/C,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;QACV,OAAO,IAAI,CAAC;IAChB,CAAC;IACD,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,MAAM,EAAE,CAAC;QACxB,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAC/C,CAAC;AAED,SAAgB,kBAAkB,CAAmB,CAAI,EAAE,CAAI;IAC3D,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;QACV,OAAO,IAAI,CAAC;IAChB,CAAC;IACD,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAmB,CAAC;IAC/C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAmB,CAAC;IAC/C,IAAI,KAAK,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM,EAAE,CAAC;QAChC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,OAAO,KAAK,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;AACnD,CAAC","sourcesContent":["export function shallowArrayEqual<T>(a: T[], b: T[]): boolean {\n    if (a === b) {\n        return true;\n    }\n    if (a.length !== b.length) {\n        return false;\n    }\n    return a.every((item, i) => item === b[i]);\n}\n\nexport function shallowObjectEqual<T extends object>(a: T, b: T): boolean {\n    if (a === b) {\n        return true;\n    }\n    const keysA = Object.keys(a) as Array<keyof T>;\n    const keysB = Object.keys(b) as Array<keyof T>;\n    if (keysA.length !== keysB.length) {\n        return false;\n    }\n    return keysA.every((key) => a[key] === b[key]);\n}\n"]}

package/build/cjs/hocs/prepareItem.js

@@ -48,13 +48,27 @@ function prepareItem(WrappedComponent) {
                     return this._currentRenderProps;
                 };
             }
-            shouldComponentUpdate(nextProps) {
+            shouldComponentUpdate(nextProps, _nextState, nextContext) {
                 const { width, height, transform } = this.props;
                 const { width: widthNext, height: heightNext, transform: transformNext } = nextProps;
-                return (nextProps.shouldItemUpdate ||
-                    width !== widthNext ||
-                    height !== heightNext ||
-                    transform !== transformNext);
+                // Layout changes (position/size) always trigger re-render
+                if (width !== widthNext || height !== heightNext || transform !== transformNext) {
+                    return true;
+                }
+                // While dragging — skip content updates
+                if (!nextProps.shouldItemUpdate) {
+                    return false;
+                }
+                const id = this.props.id;
+                const ctx = this.context;
+                // Re-render only if data relevant to this specific item changed
+                return (this.props.item !== nextProps.item ||
+                    this.props.layout !== nextProps.layout ||
+                    ctx.itemsParams[id] !== nextContext.itemsParams[id] ||
+                    ctx.itemsState[id] !== nextContext.itemsState[id] ||
+                    ctx.editMode !== nextContext.editMode ||
+                    ctx.settings !== nextContext.settings ||
+                    ctx.context !== nextContext.context);
             }
             render() {
                 const { item, isPlaceholder, forwardedPluginRef, onItemMountChange, onItemRender } = this.props;

package/build/cjs/hocs/prepareItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"prepareItem.js","sourceRoot":"../../../src","sources":["hocs/prepareItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport isEqual from 'lodash/isEqual';\n\nimport type {DashKitProps} from '../components/DashKit';\nimport type {ItemProps, RendererProps} from '../components/Item/types';\nimport {DashKitContext} from '../context';\nimport type {ConfigItem, ConfigLayout} from '../shared';\nimport type {PluginRef, PluginWidgetProps, ReactGridLayoutProps} from '../typings';\n\ntype PrepareItemProps = {\n    gridLayout?: ReactGridLayoutProps;\n    adjustWidgetLayout: PluginWidgetProps['adjustWidgetLayout'];\n    layout: ConfigLayout[];\n    id: string;\n    item: ConfigItem;\n    shouldItemUpdate?: boolean;\n    width?: number;\n    height?: number;\n    transform?: string;\n    isPlaceholder?: boolean;\n\n    onItemRender?: DashKitProps['onItemRender'];\n    onItemMountChange?: DashKitProps['onItemMountChange'];\n\n    forwardedPluginRef?: (ref: PluginRef) => void;\n};\n\nexport function prepareItem(\n    WrappedComponent: React.ComponentType<ItemProps>,\n): React.ComponentClass<PrepareItemProps> {\n    return class PrepareItem extends React.Component<PrepareItemProps> {\n        static contextType = DashKitContext;\n        context!: React.ContextType<typeof DashKitContext>;\n\n        _currentRenderProps: RendererProps = {} as RendererProps;\n\n        shouldComponentUpdate(nextProps: PrepareItemProps) {\n            const {width, height, transform} = this.props;\n            const {width: widthNext, height: heightNext, transform: transformNext} = nextProps;\n\n            return (\n                nextProps.shouldItemUpdate ||\n                width !== widthNext ||\n                height !== heightNext ||\n                transform !== transformNext\n            );\n        }\n\n        _onStateAndParamsChange: PluginWidgetProps['onStateAndParamsChange'] = (\n            stateAndParams,\n            options,\n        ) => {\n            this.context.onItemStateAndParamsChange(this.props.id, stateAndParams, options);\n        };\n\n        getRenderProps = (): RendererProps => {\n            const {id, width, height, item, adjustWidgetLayout, layout, gridLayout} = this.props;\n            const {itemsState, itemsParams, registerManager, settings, context, editMode} =\n                this.context;\n            const {data, defaults, namespace} = item;\n\n            const rendererProps: RendererProps = {\n                data,\n                editMode,\n                params: itemsParams[id],\n                state: itemsState[id],\n                onStateAndParamsChange: this._onStateAndParamsChange,\n                width,\n                height,\n                id,\n                defaults,\n                namespace,\n                settings,\n                context,\n                layout,\n                gridLayout: gridLayout || registerManager.gridLayout,\n                adjustWidgetLayout,\n            };\n\n            const changedProp = Object.entries(rendererProps).find(([key, value]) => {\n                // Checking gridLayoout deep as groups gridProperties method has tendancy to creat new objects\n                if (key === 'gridLayout') {\n                    return !isEqual(this._currentRenderProps[key as keyof RendererProps], value);\n                }\n\n                return this._currentRenderProps[key as keyof RendererProps] !== value;\n            });\n\n            if (changedProp) {\n                this._currentRenderProps = rendererProps;\n            }\n\n            return this._currentRenderProps;\n        };\n\n        render() {\n            const {item, isPlaceholder, forwardedPluginRef, onItemMountChange, onItemRender} =\n                this.props;\n            const {registerManager} = this.context;\n\n            return (\n                <WrappedComponent\n                    forwardedPluginRef={forwardedPluginRef}\n                    rendererProps={this.getRenderProps()}\n                    registerManager={registerManager}\n                    isPlaceholder={isPlaceholder}\n                    onItemMountChange={onItemMountChange}\n                    onItemRender={onItemRender}\n                    item={item}\n                />\n            );\n        }\n    };\n}\n"]}
+{"version":3,"file":"prepareItem.js","sourceRoot":"../../../src","sources":["hocs/prepareItem.tsx"],"names":[],"mappings":";;AA6BA,kCA2GC;;AAxID,0DAA0B;AAE1B,wEAAqC;AAIrC,iDAA0C;AAuB1C,SAAgB,WAAW,CACvB,gBAAgD;;IAEhD,YAAO,MAAM,WAAY,SAAQ,eAAK,CAAC,SAA2B;YAA3D;;gBAIH,wBAAmB,GAAkB,EAAmB,CAAC;gBAqDzD,4BAAuB,GAAgD,CACnE,cAAc,EACd,OAAO,EACT,EAAE;oBACA,IAAI,CAAC,OAAO,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,cAAc,EAAE,OAAO,CAAC,CAAC;gBACpF,CAAC,CAAC;gBAEF,mBAAc,GAAG,GAAkB,EAAE;oBACjC,MAAM,EAAC,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,EAAE,UAAU,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;oBACrF,MAAM,EAAC,UAAU,EAAE,WAAW,EAAE,eAAe,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAC,GACzE,IAAI,CAAC,OAAO,CAAC;oBACjB,MAAM,EAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAC,GAAG,IAAI,CAAC;oBAEzC,MAAM,aAAa,GAAkB;wBACjC,IAAI;wBACJ,QAAQ;wBACR,MAAM,EAAE,WAAW,CAAC,EAAE,CAAC;wBACvB,KAAK,EAAE,UAAU,CAAC,EAAE,CAAC;wBACrB,sBAAsB,EAAE,IAAI,CAAC,uBAAuB;wBACpD,KAAK;wBACL,MAAM;wBACN,EAAE;wBACF,QAAQ;wBACR,SAAS;wBACT,QAAQ;wBACR,OAAO;wBACP,MAAM;wBACN,UAAU,EAAE,UAAU,IAAI,eAAe,CAAC,UAAU;wBACpD,kBAAkB;qBACrB,CAAC;oBAEF,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;wBACpE,8FAA8F;wBAC9F,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;4BACvB,OAAO,CAAC,IAAA,iBAAO,EAAC,IAAI,CAAC,mBAAmB,CAAC,GAA0B,CAAC,EAAE,KAAK,CAAC,CAAC;wBACjF,CAAC;wBAED,OAAO,IAAI,CAAC,mBAAmB,CAAC,GAA0B,CAAC,KAAK,KAAK,CAAC;oBAC1E,CAAC,CAAC,CAAC;oBAEH,IAAI,WAAW,EAAE,CAAC;wBACd,IAAI,CAAC,mBAAmB,GAAG,aAAa,CAAC;oBAC7C,CAAC;oBAED,OAAO,IAAI,CAAC,mBAAmB,CAAC;gBACpC,CAAC,CAAC;YACN,CAAC;YAjGG,qBAAqB,CACjB,SAA2B,EAC3B,UAAiB,EACjB,WAA4B;gBAE5B,MAAM,EAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;gBAC9C,MAAM,EAAC,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAC,GAAG,SAAS,CAAC;gBAEnF,0DAA0D;gBAC1D,IAAI,KAAK,KAAK,SAAS,IAAI,MAAM,KAAK,UAAU,IAAI,SAAS,KAAK,aAAa,EAAE,CAAC;oBAC9E,OAAO,IAAI,CAAC;gBAChB,CAAC;gBAED,wCAAwC;gBACxC,IAAI,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC;oBAC9B,OAAO,KAAK,CAAC;gBACjB,CAAC;gBAED,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;gBACzB,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC;gBAEzB,gEAAgE;gBAChE,OAAO,CACH,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI;oBAClC,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM;oBACtC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,KAAK,WAAW,CAAC,WAAW,CAAC,EAAE,CAAC;oBACnD,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,KAAK,WAAW,CAAC,UAAU,CAAC,EAAE,CAAC;oBACjD,GAAG,CAAC,QAAQ,KAAK,WAAW,CAAC,QAAQ;oBACrC,GAAG,CAAC,QAAQ,KAAK,WAAW,CAAC,QAAQ;oBACrC,GAAG,CAAC,OAAO,KAAK,WAAW,CAAC,OAAO,CACtC,CAAC;YACN,CAAC;YAED,MAAM;gBACF,MAAM,EAAC,IAAI,EAAE,aAAa,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,YAAY,EAAC,GAC5E,IAAI,CAAC,KAAK,CAAC;gBACf,MAAM,EAAC,eAAe,EAAC,GAAG,IAAI,CAAC,OAAO,CAAC;gBAEvC,OAAO,CACH,8BAAC,gBAAgB,IACb,kBAAkB,EAAE,kBAAkB,EACtC,aAAa,EAAE,IAAI,CAAC,cAAc,EAAE,EACpC,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,iBAAiB,EACpC,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,GACZ,CACL,CAAC;YACN,CAAC;SAgDJ;QAtGU,cAAW,GAAG,wBAAe;WAsGtC;AACN,CAAC","sourcesContent":["import React from 'react';\n\nimport isEqual from 'lodash/isEqual';\n\nimport type {DashKitProps} from '../components/DashKit';\nimport type {ItemProps, RendererProps} from '../components/Item/types';\nimport {DashKitContext} from '../context';\nimport type {DashKitCtxShape} from '../context';\nimport type {ConfigItem, ConfigLayout} from '../shared';\nimport type {PluginRef, PluginWidgetProps, ReactGridLayoutProps} from '../typings';\n\ntype PrepareItemProps = {\n    gridLayout?: ReactGridLayoutProps;\n    adjustWidgetLayout: PluginWidgetProps['adjustWidgetLayout'];\n    layout: ConfigLayout[];\n    id: string;\n    item: ConfigItem;\n    shouldItemUpdate?: boolean;\n    width?: number;\n    height?: number;\n    transform?: string;\n    isPlaceholder?: boolean;\n\n    onItemRender?: DashKitProps['onItemRender'];\n    onItemMountChange?: DashKitProps['onItemMountChange'];\n\n    forwardedPluginRef?: (ref: PluginRef) => void;\n};\n\nexport function prepareItem(\n    WrappedComponent: React.ComponentType<ItemProps>,\n): React.ComponentClass<PrepareItemProps> {\n    return class PrepareItem extends React.Component<PrepareItemProps> {\n        static contextType = DashKitContext;\n        context!: React.ContextType<typeof DashKitContext>;\n\n        _currentRenderProps: RendererProps = {} as RendererProps;\n\n        shouldComponentUpdate(\n            nextProps: PrepareItemProps,\n            _nextState: never,\n            nextContext: DashKitCtxShape,\n        ) {\n            const {width, height, transform} = this.props;\n            const {width: widthNext, height: heightNext, transform: transformNext} = nextProps;\n\n            // Layout changes (position/size) always trigger re-render\n            if (width !== widthNext || height !== heightNext || transform !== transformNext) {\n                return true;\n            }\n\n            // While dragging — skip content updates\n            if (!nextProps.shouldItemUpdate) {\n                return false;\n            }\n\n            const id = this.props.id;\n            const ctx = this.context;\n\n            // Re-render only if data relevant to this specific item changed\n            return (\n                this.props.item !== nextProps.item ||\n                this.props.layout !== nextProps.layout ||\n                ctx.itemsParams[id] !== nextContext.itemsParams[id] ||\n                ctx.itemsState[id] !== nextContext.itemsState[id] ||\n                ctx.editMode !== nextContext.editMode ||\n                ctx.settings !== nextContext.settings ||\n                ctx.context !== nextContext.context\n            );\n        }\n\n        render() {\n            const {item, isPlaceholder, forwardedPluginRef, onItemMountChange, onItemRender} =\n                this.props;\n            const {registerManager} = this.context;\n\n            return (\n                <WrappedComponent\n                    forwardedPluginRef={forwardedPluginRef}\n                    rendererProps={this.getRenderProps()}\n                    registerManager={registerManager}\n                    isPlaceholder={isPlaceholder}\n                    onItemMountChange={onItemMountChange}\n                    onItemRender={onItemRender}\n                    item={item}\n                />\n            );\n        }\n\n        _onStateAndParamsChange: PluginWidgetProps['onStateAndParamsChange'] = (\n            stateAndParams,\n            options,\n        ) => {\n            this.context.onItemStateAndParamsChange(this.props.id, stateAndParams, options);\n        };\n\n        getRenderProps = (): RendererProps => {\n            const {id, width, height, item, adjustWidgetLayout, layout, gridLayout} = this.props;\n            const {itemsState, itemsParams, registerManager, settings, context, editMode} =\n                this.context;\n            const {data, defaults, namespace} = item;\n\n            const rendererProps: RendererProps = {\n                data,\n                editMode,\n                params: itemsParams[id],\n                state: itemsState[id],\n                onStateAndParamsChange: this._onStateAndParamsChange,\n                width,\n                height,\n                id,\n                defaults,\n                namespace,\n                settings,\n                context,\n                layout,\n                gridLayout: gridLayout || registerManager.gridLayout,\n                adjustWidgetLayout,\n            };\n\n            const changedProp = Object.entries(rendererProps).find(([key, value]) => {\n                // Checking gridLayoout deep as groups gridProperties method has tendancy to creat new objects\n                if (key === 'gridLayout') {\n                    return !isEqual(this._currentRenderProps[key as keyof RendererProps], value);\n                }\n\n                return this._currentRenderProps[key as keyof RendererProps] !== value;\n            });\n\n            if (changedProp) {\n                this._currentRenderProps = rendererProps;\n            }\n\n            return this._currentRenderProps;\n        };\n    };\n}\n"]}

package/build/cjs/package.json

@@ -1 +1 @@
-{"version":"10.0.0","type":"commonjs","sideEffects":["*.scss","*.css"]}
+{"version":"10.1.0","type":"commonjs","sideEffects":["*.scss","*.css"]}

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type ReactGridLayout from 'react-grid-layout';
 import type { OverlayCustomControlItem } from "../components/OverlayControls/OverlayControls.js";
 import { MenuItems } from "../constants/index.js";
@@ -6,6 +7,12 @@ export type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] |
 export type ReactGridLayoutProps = Omit<ReactGridLayout.ReactGridLayoutProps, 'children' | 'compactType' | 'innerRef' | 'key' | 'layout' | 'onDragStart' | 'onDragStop' | 'onResizeStart' | 'onResizeStop' | 'draggableHandle' | 'isDroppable' | 'onDropDragOver' | 'onDrop' | 'draggableCancel'> & {
     compactType?: CompactType;
     noOverlay?: boolean;
+    /**
+     * When the grid is inside a scaled container, pass a ref to the scale factor.
+     * DragOverLayout will inject a lazy proxy so react-draggable reads the fresh
+     * value via valueOf() at drag time — no re-render required.
+     */
+    transformScaleRef?: React.MutableRefObject<number>;
 };
 export interface Settings {
     gridLayout?: ReactGridLayoutProps;

package/build/cjs/typings/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["typings/common.ts"],"names":[],"mappings":"","sourcesContent":["import type ReactGridLayout from 'react-grid-layout';\n\nimport type {OverlayCustomControlItem} from '../components/OverlayControls/OverlayControls';\nimport {MenuItems} from '../constants';\nimport {AdditionalWidgetLayout} from '../shared';\n\nexport type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] | 'horizontal-nowrap';\n\nexport type ReactGridLayoutProps = Omit<\n    ReactGridLayout.ReactGridLayoutProps,\n    | 'children'\n    | 'compactType'\n    | 'innerRef'\n    | 'key'\n    | 'layout'\n    | 'onDragStart'\n    | 'onDragStop'\n    | 'onResizeStart'\n    | 'onResizeStop'\n    | 'draggableHandle'\n    | 'isDroppable'\n    | 'onDropDragOver'\n    | 'onDrop'\n    | 'draggableCancel'\n> & {\n    compactType?: CompactType;\n    noOverlay?: boolean;\n};\n\nexport interface Settings {\n    gridLayout?: ReactGridLayoutProps;\n    theme?: string;\n    isMobile?: boolean;\n    // @deprecated as it's possibly mutable property use Dashkit overlayMenuItems property instead\n    menu?: Array<MenuItem>;\n}\n\nexport type MenuItem = (typeof MenuItems)[keyof typeof MenuItems] | OverlayCustomControlItem;\n\nexport interface SettingsProps {\n    autoupdateInterval: number;\n    silentLoading: boolean;\n}\n\nexport interface ContextProps {\n    [key: string]: any;\n}\n\nexport interface WidgetLayout extends AdditionalWidgetLayout {\n    i: string;\n    w: number;\n    h: number;\n    x: number;\n    y: number;\n    minW?: number;\n    minH?: number;\n    maxW?: number;\n    maxH?: number;\n}\n"]}
+{"version":3,"file":"common.js","sourceRoot":"../../../src","sources":["typings/common.ts"],"names":[],"mappings":"","sourcesContent":["import React from 'react';\n\nimport type ReactGridLayout from 'react-grid-layout';\n\nimport type {OverlayCustomControlItem} from '../components/OverlayControls/OverlayControls';\nimport {MenuItems} from '../constants';\nimport {AdditionalWidgetLayout} from '../shared';\n\nexport type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] | 'horizontal-nowrap';\n\nexport type ReactGridLayoutProps = Omit<\n    ReactGridLayout.ReactGridLayoutProps,\n    | 'children'\n    | 'compactType'\n    | 'innerRef'\n    | 'key'\n    | 'layout'\n    | 'onDragStart'\n    | 'onDragStop'\n    | 'onResizeStart'\n    | 'onResizeStop'\n    | 'draggableHandle'\n    | 'isDroppable'\n    | 'onDropDragOver'\n    | 'onDrop'\n    | 'draggableCancel'\n> & {\n    compactType?: CompactType;\n    noOverlay?: boolean;\n    /**\n     * When the grid is inside a scaled container, pass a ref to the scale factor.\n     * DragOverLayout will inject a lazy proxy so react-draggable reads the fresh\n     * value via valueOf() at drag time — no re-render required.\n     */\n    transformScaleRef?: React.MutableRefObject<number>;\n};\n\nexport interface Settings {\n    gridLayout?: ReactGridLayoutProps;\n    theme?: string;\n    isMobile?: boolean;\n    // @deprecated as it's possibly mutable property use Dashkit overlayMenuItems property instead\n    menu?: Array<MenuItem>;\n}\n\nexport type MenuItem = (typeof MenuItems)[keyof typeof MenuItems] | OverlayCustomControlItem;\n\nexport interface SettingsProps {\n    autoupdateInterval: number;\n    silentLoading: boolean;\n}\n\nexport interface ContextProps {\n    [key: string]: any;\n}\n\nexport interface WidgetLayout extends AdditionalWidgetLayout {\n    i: string;\n    w: number;\n    h: number;\n    x: number;\n    y: number;\n    minW?: number;\n    minH?: number;\n    maxW?: number;\n    maxH?: number;\n}\n"]}

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

@@ -37,6 +37,7 @@ class GridItem extends React.PureComponent {
     constructor() {
         super(...arguments);
         this._isAsyncItem = false;
+        this._isMounted = false;
         this.controller = null;
         this.state = {
             isFocused: false,
@@ -54,6 +55,9 @@ class GridItem extends React.PureComponent {
             });
             // requestAnimationFrame to make call after alert() or confirm()
             requestAnimationFrame(() => {
+                if (!this._isMounted) {
+                    return;
+                }
                 // Adding elment an changing focus
                 document.body.appendChild(focusDummy);
                 focusDummy.focus();
@@ -86,6 +90,15 @@ class GridItem extends React.PureComponent {
             });
         };
     }
+    componentDidMount() {
+        this._isMounted = true;
+    }
+    componentWillUnmount() {
+        this._isMounted = false;
+        if (this.controller) {
+            this.controller.abort();
+        }
+    }
     renderOverlay() {
         const { isPlaceholder } = this.props;
         const { editMode } = this.context;

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

@@ -1 +1 @@
-{"version":3,"file":"GridItem.js","sourceRoot":"../../../../src","sources":["components/GridItem/GridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {FOCUSED_CLASS_NAME} from '../../constants';\nimport {DashKitContext} from '../../context';\nimport type {ConfigItem, ConfigLayout} from '../../shared';\nimport type {PluginRef, PluginWidgetProps, ReactGridLayoutProps} from '../../typings';\nimport {cn} from '../../utils/cn';\nimport type {DashKitProps} from '../DashKit';\nimport Item from '../Item/Item';\nimport OverlayControls from '../OverlayControls/OverlayControls';\n\nimport './GridItem.scss';\n\nconst b = cn('dashkit-grid-item');\n\nclass WindowFocusObserver {\n    subscribers = 0;\n    isFocused = !document.hidden;\n\n    constructor() {\n        window.addEventListener('blur', this.blurHandler, true);\n        window.addEventListener('focus', this.focusHandler, true);\n    }\n\n    blurHandler = (e: FocusEvent) => {\n        if (e.target === window) {\n            this.isFocused = false;\n        }\n    };\n\n    focusHandler = (e: FocusEvent) => {\n        if (e.target === window) {\n            this.isFocused = true;\n        }\n    };\n\n    // Method to get state after all blur\\focus events in document are triggered\n    async getFocusedState(): Promise<boolean> {\n        return new Promise((resolve) => {\n            requestAnimationFrame(() => {\n                resolve(this.isFocused);\n            });\n        });\n    }\n}\n\nconst windowFocusObserver = new WindowFocusObserver();\n\ntype GridItemProps = {\n    adjustWidgetLayout: PluginWidgetProps['adjustWidgetLayout'];\n    gridLayout?: ReactGridLayoutProps;\n    id: string;\n    item: ConfigItem;\n    isDragging?: boolean;\n    isDraggedOut?: boolean;\n    layout: ConfigLayout[];\n\n    forwardedRef?: React.Ref<HTMLDivElement>;\n    forwardedPluginRef?: (pluginRef: PluginRef) => void;\n    isPlaceholder?: boolean;\n\n    onItemMountChange?: DashKitProps['onItemMountChange'];\n    onItemRender?: DashKitProps['onItemRender'];\n\n    // from react-grid-layout:\n    children?: React.ReactNode;\n    className?: string;\n    style?: React.CSSProperties;\n    noOverlay?: boolean;\n    focusable?: boolean;\n    withCustomHandle?: boolean;\n    onMouseDown?: (e: React.MouseEvent<HTMLDivElement>) => void;\n    onMouseUp?: (e: React.MouseEvent<HTMLDivElement>) => void;\n    onTouchEnd?: (e: React.TouchEvent<HTMLDivElement>) => void;\n    onTouchStart?: (e: React.TouchEvent<HTMLDivElement>) => void;\n    onItemFocus?: DashKitProps['onItemFocus'];\n    onItemBlur?: DashKitProps['onItemBlur'];\n};\n\ntype GridItemState = {\n    isFocused: boolean;\n};\n\nclass GridItem extends React.PureComponent<GridItemProps, GridItemState> {\n    static contextType = DashKitContext;\n    context!: React.ContextType<typeof DashKitContext>;\n\n    _isAsyncItem = false;\n    controller: AbortController | null = null;\n\n    state: GridItemState = {\n        isFocused: false,\n    };\n\n    renderOverlay() {\n        const {isPlaceholder} = this.props;\n        const {editMode} = this.context;\n\n        if (editMode && this.props.item.data._editActive) {\n            // needed for correst pointer-events: none work in firefox\n            return <div className={b('overlay-placeholder')} />;\n        }\n\n        if (!editMode || this.props.item.data._editActive || isPlaceholder) {\n            return null;\n        }\n\n        const {item, focusable} = this.props;\n\n        return (\n            <React.Fragment>\n                <div className={b('overlay')} />\n                <OverlayControls\n                    configItem={item}\n                    onItemClick={focusable ? this.onOverlayItemClick : undefined}\n                />\n            </React.Fragment>\n        );\n    }\n\n    onOverlayItemClick = () => {\n        // Creating button element to trigger focus out\n        const focusDummy = document.createElement('button');\n        Object.assign(focusDummy.style, {\n            width: '0',\n            height: '0',\n            opacity: '0',\n            position: 'fixed',\n            top: '0',\n            left: '0',\n        });\n\n        // requestAnimationFrame to make call after alert() or confirm()\n        requestAnimationFrame(() => {\n            // Adding elment an changing focus\n            document.body.appendChild(focusDummy);\n            focusDummy.focus();\n            document.body.removeChild(focusDummy);\n\n            this.setState({isFocused: false});\n        });\n    };\n\n    onFocusHandler = () => {\n        this.setState({isFocused: true});\n\n        if (this.props.onItemFocus) {\n            // Sync focus and blur handlers\n            windowFocusObserver.getFocusedState().then(() => {\n                this.props.onItemFocus?.(this.props.item);\n            });\n        }\n\n        if (this.controller) {\n            this.controller.abort();\n        }\n    };\n\n    onBlurHandler = () => {\n        this.controller = new AbortController();\n\n        windowFocusObserver.getFocusedState().then((isWindowFocused) => {\n            if (!this.controller?.signal.aborted && isWindowFocused) {\n                this.setState({isFocused: false});\n                this.props.onItemBlur?.(this.props.item);\n            }\n\n            this.controller = null;\n        });\n    };\n\n    render() {\n        // из-за бага, что Grid Items unmounts при изменении static, isDraggable, isResaizable\n        // https://github.com/STRML/react-grid-layout/issues/721\n        const {\n            style,\n            onMouseDown,\n            onMouseUp,\n            onTouchEnd,\n            onTouchStart,\n            children,\n            className,\n            isDragging,\n            isDraggedOut,\n            noOverlay,\n            focusable,\n            withCustomHandle,\n            isPlaceholder = false,\n        } = this.props;\n        const {editMode} = this.context;\n        const {isFocused} = this.state;\n\n        const width =\n            style?.width === undefined ? undefined : Number.parseInt(String(style.width), 10);\n        const height =\n            style?.height === undefined ? undefined : Number.parseInt(String(style.height), 10);\n        const transform = style?.transform;\n        const preparedClassName =\n            (editMode\n                ? className\n                : className\n                      ?.replace('react-resizable', '')\n                      .replace('react-draggable', '')\n                      .replace(FOCUSED_CLASS_NAME, '')) +\n            (isFocused ? ` ${FOCUSED_CLASS_NAME}` : '');\n        const computedClassName = b(\n            {\n                'is-dragging': isDragging,\n                'is-dragged-out': isDraggedOut,\n                'is-focused': isFocused,\n                'with-custom-handle': withCustomHandle,\n            },\n            preparedClassName,\n        );\n\n        const preparedChildren = editMode ? children : null;\n        const reactGridLayoutProps = editMode\n            ? {onMouseDown, onMouseUp, onTouchEnd, onTouchStart}\n            : {};\n        const reactFocusProps = focusable\n            ? {\n                  onFocus: this.onFocusHandler,\n                  onBlur: this.onBlurHandler,\n                  tabIndex: -1,\n              }\n            : {};\n        const {_editActive} = this.props.item.data;\n\n        return (\n            <div\n                className={computedClassName}\n                data-qa=\"dashkit-grid-item\"\n                style={style}\n                ref={this.props.forwardedRef}\n                {...reactGridLayoutProps}\n                {...reactFocusProps}\n            >\n                <div className={b('item', {editMode: editMode && !_editActive && !noOverlay})}>\n                    <Item\n                        id={this.props.id}\n                        item={this.props.item}\n                        shouldItemUpdate={!isDragging}\n                        width={width}\n                        height={height}\n                        transform={transform}\n                        isPlaceholder={isPlaceholder}\n                        adjustWidgetLayout={this.props.adjustWidgetLayout}\n                        layout={this.props.layout}\n                        forwardedPluginRef={this.props.forwardedPluginRef}\n                        onItemMountChange={this.props.onItemMountChange}\n                        onItemRender={this.props.onItemRender}\n                        gridLayout={this.props.gridLayout}\n                    />\n                </div>\n                {!noOverlay && this.renderOverlay()}\n                {preparedChildren}\n            </div>\n        );\n    }\n}\n\nconst GridItemForwarderRef = React.forwardRef<HTMLDivElement, Omit<GridItemProps, 'forwardedRef'>>(\n    (props, ref) => {\n        return <GridItem {...props} forwardedRef={ref} />;\n    },\n);\n\nGridItemForwarderRef.displayName = 'forwardRef(GridItem)';\n\nexport default GridItemForwarderRef;\n"]}
+{"version":3,"file":"GridItem.js","sourceRoot":"../../../../src","sources":["components/GridItem/GridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {FOCUSED_CLASS_NAME} from '../../constants';\nimport {DashKitContext} from '../../context';\nimport type {ConfigItem, ConfigLayout} from '../../shared';\nimport type {PluginRef, PluginWidgetProps, ReactGridLayoutProps} from '../../typings';\nimport {cn} from '../../utils/cn';\nimport type {DashKitProps} from '../DashKit';\nimport Item from '../Item/Item';\nimport OverlayControls from '../OverlayControls/OverlayControls';\n\nimport './GridItem.scss';\n\nconst b = cn('dashkit-grid-item');\n\nclass WindowFocusObserver {\n    subscribers = 0;\n    isFocused = !document.hidden;\n\n    constructor() {\n        window.addEventListener('blur', this.blurHandler, true);\n        window.addEventListener('focus', this.focusHandler, true);\n    }\n\n    blurHandler = (e: FocusEvent) => {\n        if (e.target === window) {\n            this.isFocused = false;\n        }\n    };\n\n    focusHandler = (e: FocusEvent) => {\n        if (e.target === window) {\n            this.isFocused = true;\n        }\n    };\n\n    // Method to get state after all blur\\focus events in document are triggered\n    async getFocusedState(): Promise<boolean> {\n        return new Promise((resolve) => {\n            requestAnimationFrame(() => {\n                resolve(this.isFocused);\n            });\n        });\n    }\n}\n\nconst windowFocusObserver = new WindowFocusObserver();\n\ntype GridItemProps = {\n    adjustWidgetLayout: PluginWidgetProps['adjustWidgetLayout'];\n    gridLayout?: ReactGridLayoutProps;\n    id: string;\n    item: ConfigItem;\n    isDragging?: boolean;\n    isDraggedOut?: boolean;\n    layout: ConfigLayout[];\n\n    forwardedRef?: React.Ref<HTMLDivElement>;\n    forwardedPluginRef?: (pluginRef: PluginRef) => void;\n    isPlaceholder?: boolean;\n\n    onItemMountChange?: DashKitProps['onItemMountChange'];\n    onItemRender?: DashKitProps['onItemRender'];\n\n    // from react-grid-layout:\n    children?: React.ReactNode;\n    className?: string;\n    style?: React.CSSProperties;\n    noOverlay?: boolean;\n    focusable?: boolean;\n    withCustomHandle?: boolean;\n    onMouseDown?: (e: React.MouseEvent<HTMLDivElement>) => void;\n    onMouseUp?: (e: React.MouseEvent<HTMLDivElement>) => void;\n    onTouchEnd?: (e: React.TouchEvent<HTMLDivElement>) => void;\n    onTouchStart?: (e: React.TouchEvent<HTMLDivElement>) => void;\n    onItemFocus?: DashKitProps['onItemFocus'];\n    onItemBlur?: DashKitProps['onItemBlur'];\n};\n\ntype GridItemState = {\n    isFocused: boolean;\n};\n\nclass GridItem extends React.PureComponent<GridItemProps, GridItemState> {\n    static contextType = DashKitContext;\n    context!: React.ContextType<typeof DashKitContext>;\n\n    _isAsyncItem = false;\n    _isMounted = false;\n    controller: AbortController | null = null;\n\n    state: GridItemState = {\n        isFocused: false,\n    };\n\n    componentDidMount() {\n        this._isMounted = true;\n    }\n\n    componentWillUnmount() {\n        this._isMounted = false;\n        if (this.controller) {\n            this.controller.abort();\n        }\n    }\n\n    renderOverlay() {\n        const {isPlaceholder} = this.props;\n        const {editMode} = this.context;\n\n        if (editMode && this.props.item.data._editActive) {\n            // needed for correst pointer-events: none work in firefox\n            return <div className={b('overlay-placeholder')} />;\n        }\n\n        if (!editMode || this.props.item.data._editActive || isPlaceholder) {\n            return null;\n        }\n\n        const {item, focusable} = this.props;\n\n        return (\n            <React.Fragment>\n                <div className={b('overlay')} />\n                <OverlayControls\n                    configItem={item}\n                    onItemClick={focusable ? this.onOverlayItemClick : undefined}\n                />\n            </React.Fragment>\n        );\n    }\n\n    onOverlayItemClick = () => {\n        // Creating button element to trigger focus out\n        const focusDummy = document.createElement('button');\n        Object.assign(focusDummy.style, {\n            width: '0',\n            height: '0',\n            opacity: '0',\n            position: 'fixed',\n            top: '0',\n            left: '0',\n        });\n\n        // requestAnimationFrame to make call after alert() or confirm()\n        requestAnimationFrame(() => {\n            if (!this._isMounted) {\n                return;\n            }\n\n            // Adding elment an changing focus\n            document.body.appendChild(focusDummy);\n            focusDummy.focus();\n            document.body.removeChild(focusDummy);\n\n            this.setState({isFocused: false});\n        });\n    };\n\n    onFocusHandler = () => {\n        this.setState({isFocused: true});\n\n        if (this.props.onItemFocus) {\n            // Sync focus and blur handlers\n            windowFocusObserver.getFocusedState().then(() => {\n                this.props.onItemFocus?.(this.props.item);\n            });\n        }\n\n        if (this.controller) {\n            this.controller.abort();\n        }\n    };\n\n    onBlurHandler = () => {\n        this.controller = new AbortController();\n\n        windowFocusObserver.getFocusedState().then((isWindowFocused) => {\n            if (!this.controller?.signal.aborted && isWindowFocused) {\n                this.setState({isFocused: false});\n                this.props.onItemBlur?.(this.props.item);\n            }\n\n            this.controller = null;\n        });\n    };\n\n    render() {\n        // из-за бага, что Grid Items unmounts при изменении static, isDraggable, isResaizable\n        // https://github.com/STRML/react-grid-layout/issues/721\n        const {\n            style,\n            onMouseDown,\n            onMouseUp,\n            onTouchEnd,\n            onTouchStart,\n            children,\n            className,\n            isDragging,\n            isDraggedOut,\n            noOverlay,\n            focusable,\n            withCustomHandle,\n            isPlaceholder = false,\n        } = this.props;\n        const {editMode} = this.context;\n        const {isFocused} = this.state;\n\n        const width =\n            style?.width === undefined ? undefined : Number.parseInt(String(style.width), 10);\n        const height =\n            style?.height === undefined ? undefined : Number.parseInt(String(style.height), 10);\n        const transform = style?.transform;\n        const preparedClassName =\n            (editMode\n                ? className\n                : className\n                      ?.replace('react-resizable', '')\n                      .replace('react-draggable', '')\n                      .replace(FOCUSED_CLASS_NAME, '')) +\n            (isFocused ? ` ${FOCUSED_CLASS_NAME}` : '');\n        const computedClassName = b(\n            {\n                'is-dragging': isDragging,\n                'is-dragged-out': isDraggedOut,\n                'is-focused': isFocused,\n                'with-custom-handle': withCustomHandle,\n            },\n            preparedClassName,\n        );\n\n        const preparedChildren = editMode ? children : null;\n        const reactGridLayoutProps = editMode\n            ? {onMouseDown, onMouseUp, onTouchEnd, onTouchStart}\n            : {};\n        const reactFocusProps = focusable\n            ? {\n                  onFocus: this.onFocusHandler,\n                  onBlur: this.onBlurHandler,\n                  tabIndex: -1,\n              }\n            : {};\n        const {_editActive} = this.props.item.data;\n\n        return (\n            <div\n                className={computedClassName}\n                data-qa=\"dashkit-grid-item\"\n                style={style}\n                ref={this.props.forwardedRef}\n                {...reactGridLayoutProps}\n                {...reactFocusProps}\n            >\n                <div className={b('item', {editMode: editMode && !_editActive && !noOverlay})}>\n                    <Item\n                        id={this.props.id}\n                        item={this.props.item}\n                        shouldItemUpdate={!isDragging}\n                        width={width}\n                        height={height}\n                        transform={transform}\n                        isPlaceholder={isPlaceholder}\n                        adjustWidgetLayout={this.props.adjustWidgetLayout}\n                        layout={this.props.layout}\n                        forwardedPluginRef={this.props.forwardedPluginRef}\n                        onItemMountChange={this.props.onItemMountChange}\n                        onItemRender={this.props.onItemRender}\n                        gridLayout={this.props.gridLayout}\n                    />\n                </div>\n                {!noOverlay && this.renderOverlay()}\n                {preparedChildren}\n            </div>\n        );\n    }\n}\n\nconst GridItemForwarderRef = React.forwardRef<HTMLDivElement, Omit<GridItemProps, 'forwardedRef'>>(\n    (props, ref) => {\n        return <GridItem {...props} forwardedRef={ref} />;\n    },\n);\n\nGridItemForwarderRef.displayName = 'forwardRef(GridItem)';\n\nexport default GridItemForwarderRef;\n"]}

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

@@ -12,6 +12,9 @@ export default class GridLayout extends React.PureComponent<GridLayoutProps, Gri
     private _memoGroupsProps;
     private _memoGroupsLayouts;
     private _memoCallbacksForGroups;
+    private _memoGroupsItems;
+    private _sharedDragRef;
+    private _sharedDragPositionRef;
     private _timeout?;
     private _lastReloadAt?;
     private _parendDragNode;
@@ -25,9 +28,11 @@ export default class GridLayout extends React.PureComponent<GridLayoutProps, Gri
     getActiveLayout(): ConfigLayout[];
     getMemoGroupLayout(group: string, layout: ConfigLayout[]): MemoGroupLayout;
     getMemoGroupCallbacks(group: string): GroupCallbacks;
-    getMemoGroupProps: (group: string, renderLayout: ConfigLayout[], properties: Partial<ReactGridLayoutProps>) => {
+    getMemoGroupItems(group: string, nextItems: ConfigItem[]): ConfigItem[];
+    getMemoGroupProps: (group: string, renderLayout: ConfigLayout[], nextProperties: Partial<ReactGridLayoutProps>) => {
         layout: ConfigLayout[];
         callbacks: GroupCallbacks;
+        stableProperties: Partial<ReactGridLayoutProps>;
     };
     getLayoutAndPropsByGroup: (group: string) => LayoutAndPropsByGroup;
     getMemoForwardRefCallback: (refIndex: number) => (pluginRef: PluginRef) => void;