@gravity-ui/dashkit 10.0.0-beta.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.
- package/build/cjs/components/GridItem/GridItem.js +13 -0
- package/build/cjs/components/GridItem/GridItem.js.map +1 -1
- package/build/cjs/components/GridLayout/GridLayout.d.ts +6 -1
- package/build/cjs/components/GridLayout/GridLayout.js +54 -34
- package/build/cjs/components/GridLayout/GridLayout.js.map +1 -1
- package/build/cjs/components/GridLayout/GroupLayout.d.ts +29 -0
- package/build/cjs/components/GridLayout/GroupLayout.js +60 -0
- package/build/cjs/components/GridLayout/GroupLayout.js.map +1 -0
- package/build/cjs/components/GridLayout/ReactGridLayout.d.ts +7 -2
- package/build/cjs/components/GridLayout/ReactGridLayout.js +24 -11
- package/build/cjs/components/GridLayout/ReactGridLayout.js.map +1 -1
- package/build/cjs/components/GridLayout/utils.d.ts +2 -0
- package/build/cjs/components/GridLayout/utils.js +25 -0
- package/build/cjs/components/GridLayout/utils.js.map +1 -0
- package/build/cjs/hocs/prepareItem.js +19 -5
- package/build/cjs/hocs/prepareItem.js.map +1 -1
- package/build/cjs/package.json +1 -1
- package/build/cjs/typings/common.d.ts +7 -0
- package/build/cjs/typings/common.js.map +1 -1
- package/build/esm/components/GridItem/GridItem.js +13 -0
- package/build/esm/components/GridItem/GridItem.js.map +1 -1
- package/build/esm/components/GridLayout/GridLayout.d.ts +6 -1
- package/build/esm/components/GridLayout/GridLayout.js +55 -35
- package/build/esm/components/GridLayout/GridLayout.js.map +1 -1
- package/build/esm/components/GridLayout/GroupLayout.d.ts +29 -0
- package/build/esm/components/GridLayout/GroupLayout.js +56 -0
- package/build/esm/components/GridLayout/GroupLayout.js.map +1 -0
- package/build/esm/components/GridLayout/ReactGridLayout.d.ts +7 -2
- package/build/esm/components/GridLayout/ReactGridLayout.js +24 -11
- package/build/esm/components/GridLayout/ReactGridLayout.js.map +1 -1
- package/build/esm/components/GridLayout/utils.d.ts +2 -0
- package/build/esm/components/GridLayout/utils.js +21 -0
- package/build/esm/components/GridLayout/utils.js.map +1 -0
- package/build/esm/hocs/prepareItem.js +19 -5
- package/build/esm/hocs/prepareItem.js.map +1 -1
- package/build/esm/package.json +1 -1
- package/build/esm/typings/common.d.ts +7 -0
- package/build/esm/typings/common.js.map +1 -1
- package/package.json +1 -1
|
@@ -81,10 +81,17 @@ class DragOverLayout extends ReactGridLayout {
|
|
|
81
81
|
this.parentOnDragStop(i, x, y, sintEv);
|
|
82
82
|
}
|
|
83
83
|
};
|
|
84
|
+
// Returns true when another group's item is being dragged over this grid.
|
|
85
|
+
// Reads from the ref directly — no re-render required to stay current.
|
|
86
|
+
this.isSharedDragTarget = () => {
|
|
87
|
+
var _a;
|
|
88
|
+
const drag = (_a = this.props.dragStateRef) === null || _a === void 0 ? void 0 : _a.current;
|
|
89
|
+
return Boolean((drag === null || drag === void 0 ? void 0 : drag.isDragging) && (drag === null || drag === void 0 ? void 0 : drag.sourceGroup) !== this.props.group);
|
|
90
|
+
};
|
|
84
91
|
// Proxy mouse events -> drag methods for dnd between groups
|
|
85
92
|
this.mouseEnterHandler = (e) => {
|
|
86
93
|
var _a, _b;
|
|
87
|
-
if (this.
|
|
94
|
+
if (this.isSharedDragTarget()) {
|
|
88
95
|
// @ts-expect-error - onDragEnter is a protected method in parent class
|
|
89
96
|
this.onDragEnter(e);
|
|
90
97
|
}
|
|
@@ -94,14 +101,14 @@ class DragOverLayout extends ReactGridLayout {
|
|
|
94
101
|
};
|
|
95
102
|
this.mouseLeaveHandler = (e) => {
|
|
96
103
|
var _a, _b;
|
|
97
|
-
if (this.
|
|
104
|
+
if (this.isSharedDragTarget()) {
|
|
98
105
|
// @ts-expect-error - onDragLeave is a protected method in parent class
|
|
99
106
|
this.onDragLeave(e);
|
|
100
107
|
(_b = (_a = this.props).onDragTargetRestore) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
101
108
|
}
|
|
102
109
|
};
|
|
103
110
|
this.mouseMoveHandler = (e) => {
|
|
104
|
-
if (this.
|
|
111
|
+
if (this.isSharedDragTarget()) {
|
|
105
112
|
if (!e.nativeEvent) {
|
|
106
113
|
// Emulate nativeEvent for firefox
|
|
107
114
|
const target = this.getInnerElement() || e.target;
|
|
@@ -117,7 +124,7 @@ class DragOverLayout extends ReactGridLayout {
|
|
|
117
124
|
};
|
|
118
125
|
this.mouseUpHandler = (e) => {
|
|
119
126
|
var _a, _b;
|
|
120
|
-
if (this.
|
|
127
|
+
if (this.isSharedDragTarget()) {
|
|
121
128
|
e.preventDefault();
|
|
122
129
|
const { droppingItem } = this.props;
|
|
123
130
|
const { layout } = this.state;
|
|
@@ -183,8 +190,9 @@ class DragOverLayout extends ReactGridLayout {
|
|
|
183
190
|
return innerRef && isRefObject(innerRef) && innerRef.current ? innerRef.current : null;
|
|
184
191
|
}
|
|
185
192
|
calculateDroppingPosition(itemProps) {
|
|
193
|
+
var _a;
|
|
186
194
|
const { containerWidth, cols, w, h, rowHeight, margin, transformScale, droppingPosition } = itemProps;
|
|
187
|
-
const
|
|
195
|
+
const sharedDragPosition = (_a = this.props.sharedDragPositionRef) === null || _a === void 0 ? void 0 : _a.current;
|
|
188
196
|
let offsetX, offsetY;
|
|
189
197
|
if (sharedDragPosition) {
|
|
190
198
|
offsetX = sharedDragPosition.offsetX;
|
|
@@ -207,15 +215,20 @@ class DragOverLayout extends ReactGridLayout {
|
|
|
207
215
|
if (!gridItem) {
|
|
208
216
|
return gridItem;
|
|
209
217
|
}
|
|
218
|
+
// Lazy proxy for transformScaleRef so react-draggable reads fresh scale without re-render.
|
|
219
|
+
const { transformScaleRef } = this.props;
|
|
220
|
+
const lazyScale = transformScaleRef
|
|
221
|
+
? { valueOf: () => transformScaleRef.current }
|
|
222
|
+
: undefined;
|
|
210
223
|
if (isDroppingItem) {
|
|
211
224
|
// React.cloneElement is just cleaner then copy-paste whole processGridItem method
|
|
212
|
-
return React.cloneElement(gridItem, {
|
|
225
|
+
return React.cloneElement(gridItem, Object.assign(Object.assign({}, (lazyScale !== undefined && { transformScale: lazyScale })), {
|
|
213
226
|
// hiding preview if dragging shared item
|
|
214
|
-
style: this.
|
|
215
|
-
? Object.assign(Object.assign({}, gridItem.props.style), { opacity: 0 }) : gridItem.props.style,
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
});
|
|
227
|
+
style: this.isSharedDragTarget()
|
|
228
|
+
? 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) }));
|
|
229
|
+
}
|
|
230
|
+
if (lazyScale !== undefined) {
|
|
231
|
+
return React.cloneElement(gridItem, { transformScale: lazyScale });
|
|
219
232
|
}
|
|
220
233
|
return gridItem;
|
|
221
234
|
}
|
|
@@ -1 +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"]}
|
|
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;AA+BF,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,0EAA0E;QAC1E,uEAAuE;QACvE,uBAAkB,GAAG,GAAY,EAAE;;YAC/B,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,KAAK,CAAC,YAAY,0CAAE,OAAO,CAAC;YAC9C,OAAO,OAAO,CAAC,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,UAAU,KAAI,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,MAAK,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC/E,CAAC,CAAC;QAEF,4DAA4D;QAC5D,sBAAiB,GAAG,CAAC,CAAa,EAAQ,EAAE;;YACxC,IAAI,IAAI,CAAC,kBAAkB,EAAE,EAAE,CAAC;gBAC5B,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,kBAAkB,EAAE,EAAE,CAAC;gBAC5B,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,kBAAkB,EAAE,EAAE,CAAC;gBAC5B,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,kBAAkB,EAAE,EAAE,CAAC;gBAC5B,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;QA3NE,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;IAgKD,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,kBAAkB,GAAG,MAAA,IAAI,CAAC,KAAK,CAAC,qBAAqB,0CAAE,OAAO,CAAC;QAErE,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,2FAA2F;QAC3F,MAAM,EAAC,iBAAiB,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QACvC,MAAM,SAAS,GAAG,iBAAiB;YAC/B,CAAC,CAAE,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,OAAO,EAAuB;YACnE,CAAC,CAAC,SAAS,CAAC;QAEhB,IAAI,cAAc,EAAE,CAAC;YACjB,kFAAkF;YAClF,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,kCAC3B,CAAC,SAAS,KAAK,SAAS,IAAI,EAAC,cAAc,EAAE,SAAS,EAAC,CAAC;gBAC3D,yCAAyC;gBACzC,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE;oBAC5B,CAAC,iCAAK,QAAQ,CAAC,KAAK,CAAC,KAAK,KAAE,OAAO,EAAE,CAAC,IACtC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,EAC1B,SAAS,EAAE,GAAG,kBAAkB,IAAI,2BAA2B,EAAE,EACjE,gBAAgB,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,KAAK,CAAC,IAClE,CAAC;QACP,CAAC;QAED,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC1B,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAC,cAAc,EAAE,SAAS,EAAC,CAAC,CAAC;QACrE,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 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"]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export function shallowArrayEqual(a, b) {
|
|
2
|
+
if (a === b) {
|
|
3
|
+
return true;
|
|
4
|
+
}
|
|
5
|
+
if (a.length !== b.length) {
|
|
6
|
+
return false;
|
|
7
|
+
}
|
|
8
|
+
return a.every((item, i) => item === b[i]);
|
|
9
|
+
}
|
|
10
|
+
export function shallowObjectEqual(a, b) {
|
|
11
|
+
if (a === b) {
|
|
12
|
+
return true;
|
|
13
|
+
}
|
|
14
|
+
const keysA = Object.keys(a);
|
|
15
|
+
const keysB = Object.keys(b);
|
|
16
|
+
if (keysA.length !== keysB.length) {
|
|
17
|
+
return false;
|
|
18
|
+
}
|
|
19
|
+
return keysA.every((key) => a[key] === b[key]);
|
|
20
|
+
}
|
|
21
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"]}
|
|
@@ -44,13 +44,27 @@ export function prepareItem(WrappedComponent) {
|
|
|
44
44
|
return this._currentRenderProps;
|
|
45
45
|
};
|
|
46
46
|
}
|
|
47
|
-
shouldComponentUpdate(nextProps) {
|
|
47
|
+
shouldComponentUpdate(nextProps, _nextState, nextContext) {
|
|
48
48
|
const { width, height, transform } = this.props;
|
|
49
49
|
const { width: widthNext, height: heightNext, transform: transformNext } = nextProps;
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
50
|
+
// Layout changes (position/size) always trigger re-render
|
|
51
|
+
if (width !== widthNext || height !== heightNext || transform !== transformNext) {
|
|
52
|
+
return true;
|
|
53
|
+
}
|
|
54
|
+
// While dragging — skip content updates
|
|
55
|
+
if (!nextProps.shouldItemUpdate) {
|
|
56
|
+
return false;
|
|
57
|
+
}
|
|
58
|
+
const id = this.props.id;
|
|
59
|
+
const ctx = this.context;
|
|
60
|
+
// Re-render only if data relevant to this specific item changed
|
|
61
|
+
return (this.props.item !== nextProps.item ||
|
|
62
|
+
this.props.layout !== nextProps.layout ||
|
|
63
|
+
ctx.itemsParams[id] !== nextContext.itemsParams[id] ||
|
|
64
|
+
ctx.itemsState[id] !== nextContext.itemsState[id] ||
|
|
65
|
+
ctx.editMode !== nextContext.editMode ||
|
|
66
|
+
ctx.settings !== nextContext.settings ||
|
|
67
|
+
ctx.context !== nextContext.context);
|
|
54
68
|
}
|
|
55
69
|
render() {
|
|
56
70
|
const { item, isPlaceholder, forwardedPluginRef, onItemMountChange, onItemRender } = this.props;
|
|
@@ -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;
|
|
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 {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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":"10.
|
|
1
|
+
{"version":"10.1.0","type":"module","sideEffects":["*.scss","*.css"]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import type ReactGridLayout from 'react-grid-layout';
|
|
2
3
|
import type { OverlayCustomControlItem } from "../components/OverlayControls/OverlayControls.js";
|
|
3
4
|
import { MenuItems } from "../constants/index.js";
|
|
@@ -6,6 +7,12 @@ export type CompactType = ReactGridLayout.ReactGridLayoutProps['compactType'] |
|
|
|
6
7
|
export type ReactGridLayoutProps = Omit<ReactGridLayout.ReactGridLayoutProps, 'children' | 'compactType' | 'innerRef' | 'key' | 'layout' | 'onDragStart' | 'onDragStop' | 'onResizeStart' | 'onResizeStop' | 'draggableHandle' | 'isDroppable' | 'onDropDragOver' | 'onDrop' | 'draggableCancel'> & {
|
|
7
8
|
compactType?: CompactType;
|
|
8
9
|
noOverlay?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* When the grid is inside a scaled container, pass a ref to the scale factor.
|
|
12
|
+
* DragOverLayout will inject a lazy proxy so react-draggable reads the fresh
|
|
13
|
+
* value via valueOf() at drag time — no re-render required.
|
|
14
|
+
*/
|
|
15
|
+
transformScaleRef?: React.MutableRefObject<number>;
|
|
9
16
|
};
|
|
10
17
|
export interface Settings {
|
|
11
18
|
gridLayout?: ReactGridLayoutProps;
|
|
@@ -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"]}
|