@gravity-ui/dashkit 8.5.0-beta.1 → 8.5.0-beta.3

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 (7) hide show
  1. package/build/cjs/components/GridLayout/GridLayout.d.ts +0 -2
  2. package/build/cjs/components/GridLayout/GridLayout.js +1 -21
  3. package/build/cjs/hocs/withContext.js +95 -15
  4. package/build/esm/components/GridLayout/GridLayout.d.ts +0 -2
  5. package/build/esm/components/GridLayout/GridLayout.js +1 -21
  6. package/build/esm/hocs/withContext.js +96 -16
  7. package/package.json +1 -1
package/build/cjs/components/GridLayout/GridLayout.d.ts CHANGED
@@ -26,8 +26,6 @@ export default class GridLayout extends React.PureComponent<any, any, any> {
26
26
  _onDropDragOver: (e: any, gridProperties: any, layout: any) => any;
27
27
  _onDrop: (group: any, newLayout: any, item: any, e: any) => false | undefined;
28
28
  renderTemporaryPlaceholder(): JSX.Element | null;
29
- caclculateEmptyHorizontalSpace(layout: any, cols: any): any;
30
- getElementLayout(layout: any, properties: any): any;
31
29
  renderGroup(group: any, renderLayout: any, renderItems: any, offset: number | undefined, groupGridProperties: any): JSX.Element;
32
30
  render(): any;
33
31
  }
package/build/cjs/components/GridLayout/GridLayout.js CHANGED
@@ -51,15 +51,7 @@ class GridLayout extends react_1.default.PureComponent {
51
51
  if (!editMode || !dragOverPlugin) {
52
52
  return false;
53
53
  }
54
- let maxW = gridProperties.cols;
55
- const maxH = gridProperties.maxRows;
56
- if (gridProperties.compactType === constants_1.COMPACT_TYPE_HORIZONTAL_NOWRAP) {
57
- maxW = this.caclculateEmptyHorizontalSpace(layout, gridProperties.cols);
58
- }
59
- if (maxW === 0 || maxH === 0) {
60
- return false;
61
- }
62
- return onDropDragOver(e, { maxH, maxW });
54
+ return onDropDragOver(e, gridProperties, layout);
63
55
  };
64
56
  this._onDrop = (group, newLayout, item, e) => {
65
57
  if (!item) {
@@ -139,17 +131,6 @@ class GridLayout extends react_1.default.PureComponent {
139
131
  const { type } = temporaryLayout.dragProps;
140
132
  return (react_1.default.createElement(GridItem_1.default, { key: id, id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName), overlayControls: this.props.overlayControls }));
141
133
  }
142
- caclculateEmptyHorizontalSpace(layout, cols) {
143
- return layout.reduce((memo, item) => memo - item.w, cols);
144
- }
145
- getElementLayout(layout, properties) {
146
- let maxH;
147
- if (properties.maxRows) {
148
- maxH = properties.maxRows;
149
- }
150
- const leftSpace = this.caclculateEmptyHorizontalSpace(layout, properties.cols);
151
- return layout.map((item) => (Object.assign(Object.assign({}, item), { maxW: item.w + leftSpace, maxH })));
152
- }
153
134
  renderGroup(group, renderLayout, renderItems, offset = 0, groupGridProperties) {
154
135
  const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, } = this.context;
155
136
  const properties = groupGridProperties
@@ -157,7 +138,6 @@ class GridLayout extends react_1.default.PureComponent {
157
138
  : registerManager.gridLayout;
158
139
  let { compactType } = properties;
159
140
  if (compactType === constants_1.COMPACT_TYPE_HORIZONTAL_NOWRAP) {
160
- renderLayout = this.getElementLayout(renderLayout, properties);
161
141
  compactType = 'horizontal';
162
142
  }
163
143
  return (react_1.default.createElement(ReactGridLayout_1.Layout, Object.assign({}, properties, { compactType: compactType, layout: renderLayout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, onDragStart: this._onStart, onDragStop: (...args) => this._onStop(group, ...args), onResizeStart: this._onStart, onResizeStop: (...args) => this._onStop(group, ...args) }, (draggableHandleClassName
package/build/cjs/hocs/withContext.js CHANGED
@@ -9,6 +9,7 @@ const common_1 = require("../constants/common");
9
9
  const DashKitContext_1 = require("../context/DashKitContext");
10
10
  const shared_1 = require("../shared");
11
11
  const utils_1 = require("../utils");
12
+ const ITEM_PROPS = ['i', 'h', 'w', 'x', 'y', 'parent'];
12
13
  function useMemoStateContext(props) {
13
14
  // так как мы не хотим хранить параметры виджета с активированной автовысотой в сторе и на сервере, актуальный
14
15
  // (видимый юзером в конкретный момент времени) лэйаут (массив объектов с данными о ширине, высоте,
@@ -17,6 +18,7 @@ function useMemoStateContext(props) {
17
18
  // (высота) из конфига будет запоминаться в originalLayouts, новое значение высоты в adjustedLayouts
18
19
  const originalLayouts = react_1.default.useRef({});
19
20
  const adjustedLayouts = react_1.default.useRef({});
21
+ const nowrapAdjustedLayouts = react_1.default.useRef({});
20
22
  const [temporaryLayout, setTemporaryLayout] = react_1.default.useState(null);
21
23
  const resetTemporaryLayout = react_1.default.useCallback(() => setTemporaryLayout(null), [setTemporaryLayout]);
22
24
  const dndContext = react_1.default.useContext(DashKitContext_1.DashKitDnDContext);
@@ -52,6 +54,11 @@ function useMemoStateContext(props) {
52
54
  }
53
55
  }, [props.config, onChange]);
54
56
  const onItemRemove = react_1.default.useCallback((id) => {
57
+ if (nowrapAdjustedLayouts.current[id]) {
58
+ delete nowrapAdjustedLayouts.current[id];
59
+ delete adjustedLayouts.current[id];
60
+ delete originalLayouts.current[id];
61
+ }
55
62
  if (id === common_1.TEMPORARY_ITEM_ID) {
56
63
  resetTemporaryLayout();
57
64
  }
@@ -106,6 +113,67 @@ function useMemoStateContext(props) {
106
113
  forceUpdateLayout((prev) => prev + 1);
107
114
  }
108
115
  }, []);
116
+ const horizontalNowrapLayoutAdjust = react_1.default.useCallback((groups, layout) => {
117
+ const defaultProps = props.registerManager._gridLayout || {};
118
+ const nowrapGroups = {};
119
+ let hasNowrapGroups = false;
120
+ if (defaultProps.compactType === common_1.COMPACT_TYPE_HORIZONTAL_NOWRAP) {
121
+ nowrapGroups[common_1.DEFAULT_GROUP] = {
122
+ items: [],
123
+ leftSpace: defaultProps.cols,
124
+ };
125
+ hasNowrapGroups = true;
126
+ }
127
+ if (groups) {
128
+ groups.forEach((group) => {
129
+ var _a;
130
+ const resultProps = ((_a = group.gridProperties) === null || _a === void 0 ? void 0 : _a.call(group, defaultProps)) || {};
131
+ if (resultProps.compactType === common_1.COMPACT_TYPE_HORIZONTAL_NOWRAP) {
132
+ nowrapGroups[group.id] = {
133
+ items: [],
134
+ leftSpace: resultProps.cols,
135
+ };
136
+ hasNowrapGroups = true;
137
+ }
138
+ });
139
+ }
140
+ if (hasNowrapGroups) {
141
+ layout.forEach((item) => {
142
+ const widgetId = item.i;
143
+ const parentId = item.parent || common_1.DEFAULT_GROUP;
144
+ if (nowrapGroups[parentId]) {
145
+ nowrapGroups[parentId].items.push(item);
146
+ nowrapGroups[parentId].leftSpace -= item.w;
147
+ }
148
+ else if (nowrapAdjustedLayouts.current[item.i]) {
149
+ const { originalMaxW } = nowrapAdjustedLayouts.current[widgetId];
150
+ const adjustedItem = adjustedLayouts.current[widgetId];
151
+ if (originalMaxW) {
152
+ adjustedLayouts.current[widgetId] = Object.assign(Object.assign({}, adjustedItem), { maxW: originalMaxW });
153
+ originalLayouts.current[widgetId] = item;
154
+ }
155
+ else {
156
+ adjustedLayouts.current[widgetId] = Object.assign({}, adjustedItem);
157
+ originalLayouts.current[widgetId] = item;
158
+ }
159
+ delete nowrapAdjustedLayouts.current[widgetId];
160
+ }
161
+ });
162
+ Object.entries(nowrapGroups).forEach(([, { items, leftSpace }]) => {
163
+ items.forEach((item) => {
164
+ const maxW = item.w + leftSpace;
165
+ if (!adjustedLayouts[item.i] || adjustedLayouts[item.i].maxW > maxW) {
166
+ originalLayouts.current[item.i] = item;
167
+ adjustedLayouts.current[item.i] = Object.assign(Object.assign({}, item), { maxW });
168
+ nowrapAdjustedLayouts.current[item.i] = item.maxW
169
+ ? { maxW, originalMaxW: item.maxW }
170
+ : { maxW };
171
+ }
172
+ });
173
+ });
174
+ }
175
+ return adjustedLayouts.current;
176
+ }, [props.registerManager]);
109
177
  const itemsParams = react_1.default.useMemo(() => (0, shared_1.getItemsParams)({
110
178
  defaultGlobalParams: props.defaultGlobalParams,
111
179
  globalParams: props.globalParams,
@@ -134,10 +202,11 @@ function useMemoStateContext(props) {
134
202
  .filter(Boolean);
135
203
  }, []);
136
204
  const resultLayout = react_1.default.useMemo(() => {
205
+ const adjusted = horizontalNowrapLayoutAdjust(props.groups, props.layout);
137
206
  return props.layout.map((item) => {
138
- if (item.i in adjustedLayouts.current) {
207
+ if (item.i in adjusted) {
139
208
  // eslint-disable-next-line no-unused-vars
140
- const _a = adjustedLayouts.current[item.i] || {}, { parent } = _a, adjustedItem = tslib_1.__rest(_a, ["parent"]);
209
+ const _a = adjusted[item.i] || {}, { parent } = _a, adjustedItem = tslib_1.__rest(_a, ["parent"]);
141
210
  adjustedItem.w = item.w;
142
211
  adjustedItem.x = item.x;
143
212
  adjustedItem.y = item.y;
@@ -147,10 +216,10 @@ function useMemoStateContext(props) {
147
216
  return adjustedItem;
148
217
  }
149
218
  else {
150
- return Object.assign({}, item);
219
+ return item;
151
220
  }
152
221
  });
153
- }, [props.layout, layoutUpdateCounter]);
222
+ }, [props.layout, props.groups, horizontalNowrapLayoutAdjust, layoutUpdateCounter]);
154
223
  const reloadItems = react_1.default.useCallback((pluginsRefs, data) => {
155
224
  pluginsRefs.forEach((ref) => ref && ref.reload && ref.reload(data));
156
225
  }, []);
@@ -169,20 +238,31 @@ function useMemoStateContext(props) {
169
238
  return null;
170
239
  }
171
240
  }, [dragProps, props.registerManager]);
172
- const onDropDragOver = react_1.default.useCallback((_e, gridProps = {}) => {
241
+ const onDropDragOver = react_1.default.useCallback((_e, gridProps, groupLayout) => {
173
242
  if (temporaryLayout) {
174
243
  resetTemporaryLayout();
175
244
  return false;
176
245
  }
177
- if (dragOverPlugin) {
178
- const { defaultLayout } = dragOverPlugin;
179
- const { h = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.h) || common_1.DEFAULT_WIDGET_HEIGHT, w = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.w) || common_1.DEFAULT_WIDGET_WIDTH, } = dragProps.layout || {};
180
- return {
181
- h: gridProps.maxH ? Math.min(h, gridProps.maxH) : h,
182
- w: gridProps.maxW ? Math.min(w, gridProps.maxW) : w,
183
- };
246
+ if (!dragOverPlugin) {
247
+ return false;
248
+ }
249
+ let maxW = gridProps.cols;
250
+ const { defaultLayout } = dragOverPlugin;
251
+ const maxH = Math.min(gridProps.maxRows || Infinity, defaultLayout.maxH || Infinity);
252
+ if (gridProps.compactType === common_1.COMPACT_TYPE_HORIZONTAL_NOWRAP) {
253
+ maxW = groupLayout.reduce((memo, item) => memo - item.w, gridProps.cols);
254
+ }
255
+ if (maxW === 0 ||
256
+ maxH === 0 ||
257
+ maxW < defaultLayout.minW ||
258
+ maxH < defaultLayout.minH) {
259
+ return false;
184
260
  }
185
- return false;
261
+ const { h = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.h) || common_1.DEFAULT_WIDGET_HEIGHT, w = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.w) || common_1.DEFAULT_WIDGET_WIDTH, } = dragProps.layout || {};
262
+ return {
263
+ h: maxH ? Math.min(h, maxH) : h,
264
+ w: maxW ? Math.min(w, maxW) : w,
265
+ };
186
266
  }, [resetTemporaryLayout, temporaryLayout, dragOverPlugin, dragProps]);
187
267
  const onDropProp = props.onDrop;
188
268
  const onDrop = react_1.default.useCallback((newLayout, item) => {
@@ -196,11 +276,11 @@ function useMemoStateContext(props) {
196
276
  onDropProp({
197
277
  newLayout: newLayout.reduce((memo, l) => {
198
278
  if (l.i !== item.i) {
199
- memo.push((0, pick_1.default)(l, ['i', 'h', 'w', 'x', 'y', 'parent']));
279
+ memo.push((0, pick_1.default)(l, ITEM_PROPS));
200
280
  }
201
281
  return memo;
202
282
  }, []),
203
- itemLayout: (0, pick_1.default)(item, ['i', 'h', 'w', 'x', 'y', 'parent']),
283
+ itemLayout: (0, pick_1.default)(item, ITEM_PROPS),
204
284
  commit: resetTemporaryLayout,
205
285
  dragProps,
206
286
  });
package/build/esm/components/GridLayout/GridLayout.d.ts CHANGED
@@ -26,8 +26,6 @@ export default class GridLayout extends React.PureComponent<any, any, any> {
26
26
  _onDropDragOver: (e: any, gridProperties: any, layout: any) => any;
27
27
  _onDrop: (group: any, newLayout: any, item: any, e: any) => false | undefined;
28
28
  renderTemporaryPlaceholder(): JSX.Element | null;
29
- caclculateEmptyHorizontalSpace(layout: any, cols: any): any;
30
- getElementLayout(layout: any, properties: any): any;
31
29
  renderGroup(group: any, renderLayout: any, renderItems: any, offset: number | undefined, groupGridProperties: any): JSX.Element;
32
30
  render(): any;
33
31
  }
package/build/esm/components/GridLayout/GridLayout.js CHANGED
@@ -48,15 +48,7 @@ class GridLayout extends React.PureComponent {
48
48
  if (!editMode || !dragOverPlugin) {
49
49
  return false;
50
50
  }
51
- let maxW = gridProperties.cols;
52
- const maxH = gridProperties.maxRows;
53
- if (gridProperties.compactType === COMPACT_TYPE_HORIZONTAL_NOWRAP) {
54
- maxW = this.caclculateEmptyHorizontalSpace(layout, gridProperties.cols);
55
- }
56
- if (maxW === 0 || maxH === 0) {
57
- return false;
58
- }
59
- return onDropDragOver(e, { maxH, maxW });
51
+ return onDropDragOver(e, gridProperties, layout);
60
52
  };
61
53
  this._onDrop = (group, newLayout, item, e) => {
62
54
  if (!item) {
@@ -136,17 +128,6 @@ class GridLayout extends React.PureComponent {
136
128
  const { type } = temporaryLayout.dragProps;
137
129
  return (React.createElement(GridItem, { key: id, id: id, item: { id, type, data: {} }, layout: temporaryLayout.data, adjustWidgetLayout: this.adjustWidgetLayout, isDragging: this.state.isDragging, isPlaceholder: true, noOverlay: noOverlay, withCustomHandle: Boolean(draggableHandleClassName), overlayControls: this.props.overlayControls }));
138
130
  }
139
- caclculateEmptyHorizontalSpace(layout, cols) {
140
- return layout.reduce((memo, item) => memo - item.w, cols);
141
- }
142
- getElementLayout(layout, properties) {
143
- let maxH;
144
- if (properties.maxRows) {
145
- maxH = properties.maxRows;
146
- }
147
- const leftSpace = this.caclculateEmptyHorizontalSpace(layout, properties.cols);
148
- return layout.map((item) => (Object.assign(Object.assign({}, item), { maxW: item.w + leftSpace, maxH })));
149
- }
150
131
  renderGroup(group, renderLayout, renderItems, offset = 0, groupGridProperties) {
151
132
  const { registerManager, editMode, noOverlay, focusable, draggableHandleClassName, outerDnDEnable, } = this.context;
152
133
  const properties = groupGridProperties
@@ -154,7 +135,6 @@ class GridLayout extends React.PureComponent {
154
135
  : registerManager.gridLayout;
155
136
  let { compactType } = properties;
156
137
  if (compactType === COMPACT_TYPE_HORIZONTAL_NOWRAP) {
157
- renderLayout = this.getElementLayout(renderLayout, properties);
158
138
  compactType = 'horizontal';
159
139
  }
160
140
  return (React.createElement(Layout, Object.assign({}, properties, { compactType: compactType, layout: renderLayout, key: `group_${group}`, isDraggable: editMode, isResizable: editMode, onDragStart: this._onStart, onDragStop: (...args) => this._onStop(group, ...args), onResizeStart: this._onStart, onResizeStop: (...args) => this._onStop(group, ...args) }, (draggableHandleClassName
package/build/esm/hocs/withContext.js CHANGED
@@ -2,10 +2,11 @@ import { __rest } from "tslib";
2
2
  import React from 'react';
3
3
  import isEqual from 'lodash/isEqual';
4
4
  import pick from 'lodash/pick';
5
- import { DEFAULT_WIDGET_HEIGHT, DEFAULT_WIDGET_WIDTH, TEMPORARY_ITEM_ID } from '../constants/common';
5
+ import { COMPACT_TYPE_HORIZONTAL_NOWRAP, DEFAULT_GROUP, DEFAULT_WIDGET_HEIGHT, DEFAULT_WIDGET_WIDTH, TEMPORARY_ITEM_ID, } from '../constants/common';
6
6
  import { DashKitContext, DashKitDnDContext } from '../context/DashKitContext';
7
7
  import { getItemsParams, getItemsState } from '../shared';
8
8
  import { UpdateManager } from '../utils';
9
+ const ITEM_PROPS = ['i', 'h', 'w', 'x', 'y', 'parent'];
9
10
  function useMemoStateContext(props) {
10
11
  // так как мы не хотим хранить параметры виджета с активированной автовысотой в сторе и на сервере, актуальный
11
12
  // (видимый юзером в конкретный момент времени) лэйаут (массив объектов с данными о ширине, высоте,
@@ -14,6 +15,7 @@ function useMemoStateContext(props) {
14
15
  // (высота) из конфига будет запоминаться в originalLayouts, новое значение высоты в adjustedLayouts
15
16
  const originalLayouts = React.useRef({});
16
17
  const adjustedLayouts = React.useRef({});
18
+ const nowrapAdjustedLayouts = React.useRef({});
17
19
  const [temporaryLayout, setTemporaryLayout] = React.useState(null);
18
20
  const resetTemporaryLayout = React.useCallback(() => setTemporaryLayout(null), [setTemporaryLayout]);
19
21
  const dndContext = React.useContext(DashKitDnDContext);
@@ -49,6 +51,11 @@ function useMemoStateContext(props) {
49
51
  }
50
52
  }, [props.config, onChange]);
51
53
  const onItemRemove = React.useCallback((id) => {
54
+ if (nowrapAdjustedLayouts.current[id]) {
55
+ delete nowrapAdjustedLayouts.current[id];
56
+ delete adjustedLayouts.current[id];
57
+ delete originalLayouts.current[id];
58
+ }
52
59
  if (id === TEMPORARY_ITEM_ID) {
53
60
  resetTemporaryLayout();
54
61
  }
@@ -103,6 +110,67 @@ function useMemoStateContext(props) {
103
110
  forceUpdateLayout((prev) => prev + 1);
104
111
  }
105
112
  }, []);
113
+ const horizontalNowrapLayoutAdjust = React.useCallback((groups, layout) => {
114
+ const defaultProps = props.registerManager._gridLayout || {};
115
+ const nowrapGroups = {};
116
+ let hasNowrapGroups = false;
117
+ if (defaultProps.compactType === COMPACT_TYPE_HORIZONTAL_NOWRAP) {
118
+ nowrapGroups[DEFAULT_GROUP] = {
119
+ items: [],
120
+ leftSpace: defaultProps.cols,
121
+ };
122
+ hasNowrapGroups = true;
123
+ }
124
+ if (groups) {
125
+ groups.forEach((group) => {
126
+ var _a;
127
+ const resultProps = ((_a = group.gridProperties) === null || _a === void 0 ? void 0 : _a.call(group, defaultProps)) || {};
128
+ if (resultProps.compactType === COMPACT_TYPE_HORIZONTAL_NOWRAP) {
129
+ nowrapGroups[group.id] = {
130
+ items: [],
131
+ leftSpace: resultProps.cols,
132
+ };
133
+ hasNowrapGroups = true;
134
+ }
135
+ });
136
+ }
137
+ if (hasNowrapGroups) {
138
+ layout.forEach((item) => {
139
+ const widgetId = item.i;
140
+ const parentId = item.parent || DEFAULT_GROUP;
141
+ if (nowrapGroups[parentId]) {
142
+ nowrapGroups[parentId].items.push(item);
143
+ nowrapGroups[parentId].leftSpace -= item.w;
144
+ }
145
+ else if (nowrapAdjustedLayouts.current[item.i]) {
146
+ const { originalMaxW } = nowrapAdjustedLayouts.current[widgetId];
147
+ const adjustedItem = adjustedLayouts.current[widgetId];
148
+ if (originalMaxW) {
149
+ adjustedLayouts.current[widgetId] = Object.assign(Object.assign({}, adjustedItem), { maxW: originalMaxW });
150
+ originalLayouts.current[widgetId] = item;
151
+ }
152
+ else {
153
+ adjustedLayouts.current[widgetId] = Object.assign({}, adjustedItem);
154
+ originalLayouts.current[widgetId] = item;
155
+ }
156
+ delete nowrapAdjustedLayouts.current[widgetId];
157
+ }
158
+ });
159
+ Object.entries(nowrapGroups).forEach(([, { items, leftSpace }]) => {
160
+ items.forEach((item) => {
161
+ const maxW = item.w + leftSpace;
162
+ if (!adjustedLayouts[item.i] || adjustedLayouts[item.i].maxW > maxW) {
163
+ originalLayouts.current[item.i] = item;
164
+ adjustedLayouts.current[item.i] = Object.assign(Object.assign({}, item), { maxW });
165
+ nowrapAdjustedLayouts.current[item.i] = item.maxW
166
+ ? { maxW, originalMaxW: item.maxW }
167
+ : { maxW };
168
+ }
169
+ });
170
+ });
171
+ }
172
+ return adjustedLayouts.current;
173
+ }, [props.registerManager]);
106
174
  const itemsParams = React.useMemo(() => getItemsParams({
107
175
  defaultGlobalParams: props.defaultGlobalParams,
108
176
  globalParams: props.globalParams,
@@ -131,10 +199,11 @@ function useMemoStateContext(props) {
131
199
  .filter(Boolean);
132
200
  }, []);
133
201
  const resultLayout = React.useMemo(() => {
202
+ const adjusted = horizontalNowrapLayoutAdjust(props.groups, props.layout);
134
203
  return props.layout.map((item) => {
135
- if (item.i in adjustedLayouts.current) {
204
+ if (item.i in adjusted) {
136
205
  // eslint-disable-next-line no-unused-vars
137
- const _a = adjustedLayouts.current[item.i] || {}, { parent } = _a, adjustedItem = __rest(_a, ["parent"]);
206
+ const _a = adjusted[item.i] || {}, { parent } = _a, adjustedItem = __rest(_a, ["parent"]);
138
207
  adjustedItem.w = item.w;
139
208
  adjustedItem.x = item.x;
140
209
  adjustedItem.y = item.y;
@@ -144,10 +213,10 @@ function useMemoStateContext(props) {
144
213
  return adjustedItem;
145
214
  }
146
215
  else {
147
- return Object.assign({}, item);
216
+ return item;
148
217
  }
149
218
  });
150
- }, [props.layout, layoutUpdateCounter]);
219
+ }, [props.layout, props.groups, horizontalNowrapLayoutAdjust, layoutUpdateCounter]);
151
220
  const reloadItems = React.useCallback((pluginsRefs, data) => {
152
221
  pluginsRefs.forEach((ref) => ref && ref.reload && ref.reload(data));
153
222
  }, []);
@@ -166,20 +235,31 @@ function useMemoStateContext(props) {
166
235
  return null;
167
236
  }
168
237
  }, [dragProps, props.registerManager]);
169
- const onDropDragOver = React.useCallback((_e, gridProps = {}) => {
238
+ const onDropDragOver = React.useCallback((_e, gridProps, groupLayout) => {
170
239
  if (temporaryLayout) {
171
240
  resetTemporaryLayout();
172
241
  return false;
173
242
  }
174
- if (dragOverPlugin) {
175
- const { defaultLayout } = dragOverPlugin;
176
- const { h = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.h) || DEFAULT_WIDGET_HEIGHT, w = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.w) || DEFAULT_WIDGET_WIDTH, } = dragProps.layout || {};
177
- return {
178
- h: gridProps.maxH ? Math.min(h, gridProps.maxH) : h,
179
- w: gridProps.maxW ? Math.min(w, gridProps.maxW) : w,
180
- };
243
+ if (!dragOverPlugin) {
244
+ return false;
245
+ }
246
+ let maxW = gridProps.cols;
247
+ const { defaultLayout } = dragOverPlugin;
248
+ const maxH = Math.min(gridProps.maxRows || Infinity, defaultLayout.maxH || Infinity);
249
+ if (gridProps.compactType === COMPACT_TYPE_HORIZONTAL_NOWRAP) {
250
+ maxW = groupLayout.reduce((memo, item) => memo - item.w, gridProps.cols);
251
+ }
252
+ if (maxW === 0 ||
253
+ maxH === 0 ||
254
+ maxW < defaultLayout.minW ||
255
+ maxH < defaultLayout.minH) {
256
+ return false;
181
257
  }
182
- return false;
258
+ const { h = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.h) || DEFAULT_WIDGET_HEIGHT, w = (defaultLayout === null || defaultLayout === void 0 ? void 0 : defaultLayout.w) || DEFAULT_WIDGET_WIDTH, } = dragProps.layout || {};
259
+ return {
260
+ h: maxH ? Math.min(h, maxH) : h,
261
+ w: maxW ? Math.min(w, maxW) : w,
262
+ };
183
263
  }, [resetTemporaryLayout, temporaryLayout, dragOverPlugin, dragProps]);
184
264
  const onDropProp = props.onDrop;
185
265
  const onDrop = React.useCallback((newLayout, item) => {
@@ -193,11 +273,11 @@ function useMemoStateContext(props) {
193
273
  onDropProp({
194
274
  newLayout: newLayout.reduce((memo, l) => {
195
275
  if (l.i !== item.i) {
196
- memo.push(pick(l, ['i', 'h', 'w', 'x', 'y', 'parent']));
276
+ memo.push(pick(l, ITEM_PROPS));
197
277
  }
198
278
  return memo;
199
279
  }, []),
200
- itemLayout: pick(item, ['i', 'h', 'w', 'x', 'y', 'parent']),
280
+ itemLayout: pick(item, ITEM_PROPS),
201
281
  commit: resetTemporaryLayout,
202
282
  dragProps,
203
283
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/dashkit",
3
- "version": "8.5.0-beta.1",
3
+ "version": "8.5.0-beta.3",
4
4
  "description": "Library for rendering dashboard grid layout",
5
5
  "license": "MIT",
6
6
  "repository": {