@gravity-ui/dashkit 8.5.0-beta.2 → 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 -19
  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 -20
  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,27 +202,24 @@ 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;
144
213
  if (item.parent) {
145
214
  adjustedItem.parent = item.parent;
146
215
  }
147
- // update originalLayouts memoized item
148
- if (originalLayouts.current[item.i]) {
149
- originalLayouts.current[item.i] = item;
150
- }
151
216
  return adjustedItem;
152
217
  }
153
218
  else {
154
- return Object.assign({}, item);
219
+ return item;
155
220
  }
156
221
  });
157
- }, [props.layout, layoutUpdateCounter]);
222
+ }, [props.layout, props.groups, horizontalNowrapLayoutAdjust, layoutUpdateCounter]);
158
223
  const reloadItems = react_1.default.useCallback((pluginsRefs, data) => {
159
224
  pluginsRefs.forEach((ref) => ref && ref.reload && ref.reload(data));
160
225
  }, []);
@@ -173,20 +238,31 @@ function useMemoStateContext(props) {
173
238
  return null;
174
239
  }
175
240
  }, [dragProps, props.registerManager]);
176
- const onDropDragOver = react_1.default.useCallback((_e, gridProps = {}) => {
241
+ const onDropDragOver = react_1.default.useCallback((_e, gridProps, groupLayout) => {
177
242
  if (temporaryLayout) {
178
243
  resetTemporaryLayout();
179
244
  return false;
180
245
  }
181
- if (dragOverPlugin) {
182
- const { defaultLayout } = dragOverPlugin;
183
- 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 || {};
184
- return {
185
- h: gridProps.maxH ? Math.min(h, gridProps.maxH) : h,
186
- w: gridProps.maxW ? Math.min(w, gridProps.maxW) : w,
187
- };
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;
188
260
  }
189
- 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
+ };
190
266
  }, [resetTemporaryLayout, temporaryLayout, dragOverPlugin, dragProps]);
191
267
  const onDropProp = props.onDrop;
192
268
  const onDrop = react_1.default.useCallback((newLayout, item) => {
@@ -200,11 +276,11 @@ function useMemoStateContext(props) {
200
276
  onDropProp({
201
277
  newLayout: newLayout.reduce((memo, l) => {
202
278
  if (l.i !== item.i) {
203
- memo.push((0, pick_1.default)(l, ['i', 'h', 'w', 'x', 'y', 'parent']));
279
+ memo.push((0, pick_1.default)(l, ITEM_PROPS));
204
280
  }
205
281
  return memo;
206
282
  }, []),
207
- itemLayout: (0, pick_1.default)(item, ['i', 'h', 'w', 'x', 'y', 'parent']),
283
+ itemLayout: (0, pick_1.default)(item, ITEM_PROPS),
208
284
  commit: resetTemporaryLayout,
209
285
  dragProps,
210
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,27 +199,24 @@ 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;
141
210
  if (item.parent) {
142
211
  adjustedItem.parent = item.parent;
143
212
  }
144
- // update originalLayouts memoized item
145
- if (originalLayouts.current[item.i]) {
146
- originalLayouts.current[item.i] = item;
147
- }
148
213
  return adjustedItem;
149
214
  }
150
215
  else {
151
- return Object.assign({}, item);
216
+ return item;
152
217
  }
153
218
  });
154
- }, [props.layout, layoutUpdateCounter]);
219
+ }, [props.layout, props.groups, horizontalNowrapLayoutAdjust, layoutUpdateCounter]);
155
220
  const reloadItems = React.useCallback((pluginsRefs, data) => {
156
221
  pluginsRefs.forEach((ref) => ref && ref.reload && ref.reload(data));
157
222
  }, []);
@@ -170,20 +235,31 @@ function useMemoStateContext(props) {
170
235
  return null;
171
236
  }
172
237
  }, [dragProps, props.registerManager]);
173
- const onDropDragOver = React.useCallback((_e, gridProps = {}) => {
238
+ const onDropDragOver = React.useCallback((_e, gridProps, groupLayout) => {
174
239
  if (temporaryLayout) {
175
240
  resetTemporaryLayout();
176
241
  return false;
177
242
  }
178
- if (dragOverPlugin) {
179
- const { defaultLayout } = dragOverPlugin;
180
- 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 || {};
181
- return {
182
- h: gridProps.maxH ? Math.min(h, gridProps.maxH) : h,
183
- w: gridProps.maxW ? Math.min(w, gridProps.maxW) : w,
184
- };
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;
185
257
  }
186
- 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
+ };
187
263
  }, [resetTemporaryLayout, temporaryLayout, dragOverPlugin, dragProps]);
188
264
  const onDropProp = props.onDrop;
189
265
  const onDrop = React.useCallback((newLayout, item) => {
@@ -197,11 +273,11 @@ function useMemoStateContext(props) {
197
273
  onDropProp({
198
274
  newLayout: newLayout.reduce((memo, l) => {
199
275
  if (l.i !== item.i) {
200
- memo.push(pick(l, ['i', 'h', 'w', 'x', 'y', 'parent']));
276
+ memo.push(pick(l, ITEM_PROPS));
201
277
  }
202
278
  return memo;
203
279
  }, []),
204
- itemLayout: pick(item, ['i', 'h', 'w', 'x', 'y', 'parent']),
280
+ itemLayout: pick(item, ITEM_PROPS),
205
281
  commit: resetTemporaryLayout,
206
282
  dragProps,
207
283
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/dashkit",
3
- "version": "8.5.0-beta.2",
3
+ "version": "8.5.0-beta.3",
4
4
  "description": "Library for rendering dashboard grid layout",
5
5
  "license": "MIT",
6
6
  "repository": {