npm - @gravity-ui/dashkit - Versions diffs - 10.0.0 → 10.1.0 - Mend

@gravity-ui/dashkit 10.0.0 → 10.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

package/build/esm/components/GridLayout/ReactGridLayout.js CHANGED Viewed

@@ -81,10 +81,17 @@ class DragOverLayout extends ReactGridLayout {
                 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);
             }
@@ -94,14 +101,14 @@ class DragOverLayout extends ReactGridLayout {
         };
         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;
@@ -117,7 +124,7 @@ class DragOverLayout extends ReactGridLayout {
         };
         this.mouseUpHandler = (e) => {
             var _a, _b;
-            if (this.props.hasSharedDragItem) {
+            if (this.isSharedDragTarget()) {
                 e.preventDefault();
                 const { droppingItem } = this.props;
                 const { layout } = this.state;
@@ -183,8 +190,9 @@ class DragOverLayout extends ReactGridLayout {
         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;
@@ -207,15 +215,20 @@ class DragOverLayout extends ReactGridLayout {
         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.cloneElement(gridItem, {
+            return React.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: `${OVERLAY_CLASS_NAME} ${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: `${OVERLAY_CLASS_NAME} ${DROPPING_ELEMENT_CLASS_NAME}`, droppingPosition: this.calculateDroppingPosition(gridItem.props) }));
+        }
+        if (lazyScale !== undefined) {
+            return React.cloneElement(gridItem, { transformScale: lazyScale });
         }
         return gridItem;
     }

package/build/esm/components/GridLayout/ReactGridLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReactGridLayout.js","sourceRoot":"../../../../src","sources":["components/GridLayout/ReactGridLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,+DAA+D;AAC/D,OAAO,eAAe,EAAE,EAAC,aAAa,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAExE,OAAO,EAAC,2BAA2B,EAAE,kBAAkB,EAAC,iCAAwB;AAEhF,MAAM,WAAW,GAAG,CAChB,KAAgC,EACQ,EAAE;IAC1C,OAAO,CACH,OAAO,KAAK,KAAK,QAAQ;QACzB,KAAK,KAAK,IAAI;QACd,SAAS,IAAI,KAAK;QAClB,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ,CACpC,CAAC;AACN,CAAC,CAAC;AA6BF,MAAM,cAAe,SAAQ,eAAe;IAUxC,YAAY,KAA0B,EAAE,OAAiB;QACrD,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAH1B,2BAAsB,GAAuB,IAAI,CAAC;QAoElD,mDAAmD;QACnD,6BAAwB,GAAG,GAAS,EAAE;YAClC,8EAA8E;YAC9E,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACxB,8EAA8E;gBAC9E,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC;gBAC1B,qFAAqF;gBACrF,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACrC,CAAC;QACL,CAAC,CAAC;QAEF,+CAA+C;QAC/C,yBAAoB,GAAG,CAAC,CAAS,EAAe,EAAE;YAC9C,MAAM,EAAC,MAAM,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YAC5B,MAAM,EAAC,IAAI,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YAC1B,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,mBAAK,IAAI,EAAE,CAAC,CAAC;YAEtD,IAAI,aAAoC,CAAC;YACzC,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAC3B,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE;gBACnB,IAAI,IAAI,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC;oBACf,aAAa,GAAG,IAAI,CAAC;oBACrB,OAAO,KAAK,CAAC;gBACjB,CAAC;gBAED,OAAO,IAAI,CAAC;YAChB,CAAC,CAAC,EACF,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,EAC7B,IAAI,CACP,CAAC;YAEF,IAAI,aAAa,EAAE,CAAC;gBAChB,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YAClC,CAAC;YAED,IAAI,CAAC,QAAQ,CAAC;gBACV,UAAU,EAAE,IAAI;gBAChB,MAAM,EAAE,SAAS;aACpB,CAAC,CAAC;YAEH,OAAO,WAAW,CAAC;QACvB,CAAC,CAAC;QAEF,mBAAc,GAAG,CACb,CAAS,EACT,CAAS,EACT,CAAS,EACT,MAAqC,EACjC,EAAE;YACN,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC;gBAC5B,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC;oBAC/B,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;gBAC/D,CAAC;gBAED,OAAO;YACX,CAAC;YAED,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;YACnC,gDAAgD;YAChD,IAAI,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC;QACvC,CAAC,CAAC;QAEF,uBAAkB,GAAG,CACjB,CAAS,EACT,CAAS,EACT,CAAS,EACT,MAAqC,EACjC,EAAE;YACN,2DAA2D;YAC3D,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC;gBAC9B,MAAM,WAAW,GAAG,IAAI,CAAC,sBAAsB,CAAC;gBAChD,MAAM,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;gBAE9C,oCAAoC;gBACpC,MAAM,WAAW,GAA6B;oBAC1C,CAAC,EAAE,CAAC,CAAC,CAAC;oBACN,CAAC,EAAE,CAAC,CAAC,CAAC;oBACN,CAAC,EAAE,CAAC,CAAC,CAAC;oBACN,CAAC,EAAE,CAAC,CAAC,CAAC;oBACN,WAAW,EAAE,IAAI;oBACjB,CAAC,EAAE,CAAC;iBACP,CAAC;gBAEF,IAAI,CAAC,QAAQ,CACT;oBACI,MAAM,EAAE,WAAW;oBACnB,UAAU,EAAE,WAAW;iBAC1B,EACD,GAAG,EAAE;oBACD,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC;gBAC3C,CAAC,CACJ,CAAC;gBAEF,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;YACvC,CAAC;iBAAM,CAAC;gBACJ,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC;YAC3C,CAAC;QACL,CAAC,CAAC;QAEF,4DAA4D;QAC5D,sBAAiB,GAAG,CAAC,CAAa,EAAQ,EAAE;;YACxC,IAAI,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC/B,uEAAuE;gBACvE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;YACxB,CAAC;iBAAM,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACnC,MAAA,MAAA,IAAI,CAAC,KAAK,EAAC,mBAAmB,kDAAI,CAAC;YACvC,CAAC;QACL,CAAC,CAAC;QAEF,sBAAiB,GAAG,CAAC,CAAa,EAAQ,EAAE;;YACxC,IAAI,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC/B,uEAAuE;gBACvE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;gBACpB,MAAA,MAAA,IAAI,CAAC,KAAK,EAAC,mBAAmB,kDAAI,CAAC;YACvC,CAAC;QACL,CAAC,CAAC;QAEF,qBAAgB,GAAG,CAAC,CAAa,EAAQ,EAAE;YACvC,IAAI,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC/B,IAAI,CAAE,CAA6C,CAAC,WAAW,EAAE,CAAC;oBAC9D,kCAAkC;oBAClC,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,EAAE,IAAK,CAAC,CAAC,MAAsB,CAAC;oBAElE,CAAqD,CAAC,WAAW,GAAG;wBACjE,OAAO,EAAE,CAAC,CAAC,OAAO;wBAClB,OAAO,EAAE,CAAC,CAAC,OAAO;wBAClB,MAAM;qBACT,CAAC;gBACN,CAAC;gBAED,sEAAsE;gBACtE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YACvB,CAAC;QACL,CAAC,CAAC;QAEF,mBAAc,GAAG,CAAC,CAAa,EAAQ,EAAE;;YACrC,IAAI,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC/B,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,MAAM,EAAC,YAAY,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;gBAClC,MAAM,EAAC,MAAM,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;gBAC5B,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,CAAC,CAAA,CAAC,CAAC;gBAEzD,kCAAkC;gBAClC,IAAI,CAAC,wBAAwB,EAAE,CAAC;gBAEhC,IAAI,IAAI,EAAE,CAAC;oBACP,MAAA,MAAA,IAAI,CAAC,KAAK,EAAC,MAAM,mDAAG,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;gBACzC,CAAC;YACL,CAAC;QACL,CAAC,CAAC;QApNE,kEAAkE;QAClE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC;QAChC,gEAAgE;QAChE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC;QAElC,sEAAsE;QACtE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,UAAU,CAAC;QACxC,oEAAoE;QACpE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,kBAAkB,CAAC;IAC9C,CAAC;IAED,iBAAiB;;QACb,MAAA,KAAK,CAAC,iBAAiB,oDAAI,CAAC;QAE5B,sDAAsD;QACtD,mFAAmF;QACnF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAClE,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAE5C,IAAI,YAAY,EAAE,CAAC;YACf,YAAY,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;YAC9D,YAAY,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACpE,YAAY,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACpE,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACtE,CAAC;IACL,CAAC;IAED,oBAAoB;QAChB,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,wBAAwB,CAAC,CAAC;QACrE,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAE5C,IAAI,YAAY,EAAE,CAAC;YACf,YAAY,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;YACjE,YAAY,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACvE,YAAY,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACvE,YAAY,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACzE,CAAC;IACL,CAAC;IAED,+EAA+E;IAC/E,oCAAoC;IACpC,0EAA0E;IAC1E,eAAe;QACX,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACxD,OAAO;QACX,CAAC;QAED,6CAA6C;QAC7C,2EAA2E;QAC3E,OAAO,KAAK,CAAC,eAAe,EAAE,CAAC;IACnC,CAAC;IAED,yEAAyE;IACzE,6BAA6B;IAC7B,gDAAgD;IAChD,0DAA0D;IAC1D,+DAA+D;IAC/D,eAAe;QACX,MAAM,EAAC,QAAQ,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAE9B,OAAO,QAAQ,IAAI,WAAW,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC;IAC3F,CAAC;IAyJD,yBAAyB,CAAC,SASzB;QACG,MAAM,EAAC,cAAc,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,cAAc,EAAE,gBAAgB,EAAC,GACnF,SAAS,CAAC;QACd,MAAM,EAAC,kBAAkB,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAExC,IAAI,OAAe,EAAE,OAAe,CAAC;QAErC,IAAI,kBAAkB,EAAE,CAAC;YACrB,OAAO,GAAG,kBAAkB,CAAC,OAAO,CAAC;YACrC,OAAO,GAAG,kBAAkB,CAAC,OAAO,CAAC;QACzC,CAAC;aAAM,CAAC;YACJ,OAAO,GAAG,CAAC,CAAC,CAAC,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,cAAc,CAAC;YACpE,OAAO,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,cAAc,CAAC;QAChF,CAAC;QAED,uCACO,gBAAgB,KACnB,IAAI,EAAE,gBAAgB,CAAC,IAAI,GAAG,OAAO,EACrC,GAAG,EAAE,gBAAgB,CAAC,GAAG,GAAG,OAAO,IACrC;IACN,CAAC;IAED,mDAAmD;IACnD,6CAA6C;IAC7C,gEAAgE;IAChE,gCAAgC;IAChC,eAAe,CACX,KAAyB,EACzB,cAAwB;;QAExB,2EAA2E;QAC3E,MAAM,QAAQ,GAAG,MAAA,KAAK,CAAC,eAAe,qDAAG,KAAK,EAAE,cAAc,CAAC,CAAC;QAEhE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACZ,OAAO,QAAQ,CAAC;QACpB,CAAC;QAED,IAAI,cAAc,EAAE,CAAC;YACjB,kFAAkF;YAClF,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE;gBAChC,yCAAyC;gBACzC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,iBAAiB;oBAC/B,CAAC,iCAAK,QAAQ,CAAC,KAAK,CAAC,KAAK,KAAE,OAAO,EAAE,CAAC,IACtC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK;gBAC1B,SAAS,EAAE,GAAG,kBAAkB,IAAI,2BAA2B,EAAE;gBACjE,gBAAgB,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,KAAK,CAAC;aACnE,CAAC,CAAC;QACP,CAAC;QAED,OAAO,QAAQ,CAAC;IACpB,CAAC;CACJ;AAED,mCAAmC;AACnC,MAAM,CAAC,MAAM,MAAM,GAAG,aAAa,CAAsB,cAAc,CAAC,CAAC","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"]}
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 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/esm/components/GridLayout/utils.d.ts ADDED Viewed

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

package/build/esm/components/GridLayout/utils.js ADDED Viewed

@@ -0,0 +1,21 @@
+export function shallowArrayEqual(a, b) {
+    if (a === b) {
+        return true;
+    }
+    if (a.length !== b.length) {
+        return false;
+    }
+    return a.every((item, i) => item === b[i]);
+}
+export 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/esm/components/GridLayout/utils.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.js","sourceRoot":"../../../../src","sources":["components/GridLayout/utils.tsx"],"names":[],"mappings":"AAAA,MAAM,UAAU,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,MAAM,UAAU,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/esm/hocs/prepareItem.js CHANGED Viewed

@@ -44,13 +44,27 @@ export 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/esm/hocs/prepareItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"prepareItem.js","sourceRoot":"../../../src","sources":["hocs/prepareItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,OAAO,0BAAuB;AAIrC,OAAO,EAAC,cAAc,EAAC,4BAAmB;~~AAsB1C~~,MAAM,UAAU,WAAW,CACvB,gBAAgD;;IAEhD,YAAO,MAAM,WAAY,SAAQ,KAAK,CAAC,SAA2B;YAA3D;;gBAIH,wBAAmB,GAAkB,EAAmB,CAAC;~~gBAczD~~,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,OAAO,CAAC,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;~~YAmBN~~,CAAC;~~YA5EG~~,qBAAqB,~~CAAC~~,SAA2B;~~gBAC7C~~,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,OAAO,~~CACH~~,SAAS,CAAC,gBAAgB;~~oBAC1B~~,KAAK,KAAK,SAAS;~~oBACnB~~,MAAM,KAAK,UAAU;~~oBACrB~~,~~SAAS~~,KAAK,~~aAAa~~,~~CAC9B~~,CAAC;YACN,CAAC;~~YAiDD~~,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,oBAAC,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;~~SACJ~~;~~QAjFU~~,cAAW,GAAG,cAAe;~~WAiFtC~~;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 {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"]}
1	+ {"version":3,"file":"prepareItem.js","sourceRoot":"../../../src","sources":["hocs/prepareItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,OAAO,0BAAuB;AAIrC,OAAO,EAAC,cAAc,EAAC,4BAAmB;AAuB1C,MAAM,UAAU,WAAW,CACvB,gBAAgD;;IAEhD,YAAO,MAAM,WAAY,SAAQ,KAAK,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,OAAO,CAAC,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,oBAAC,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,cAAe;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/esm/package.json CHANGED Viewed

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

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

@@ -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/esm/typings/common.js.map CHANGED Viewed

	@@ -1 +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"]}
1	+ {"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/package.json CHANGED Viewed

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