react-grid-layout 2.2.4 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/README.md +5 -0
  2. package/dist/{ResponsiveGridLayout-BjVraYMQ.d.mts → ResponsiveGridLayout-BSYEMZ9d.d.ts} +4 -4
  3. package/dist/{ResponsiveGridLayout-BrhkSyZk.d.ts → ResponsiveGridLayout-RNuyRTPe.d.mts} +4 -4
  4. package/dist/{calculate-DH4EVtn1.d.mts → calculate-BXoe3Mfz.d.mts} +1 -1
  5. package/dist/{calculate-rP3DHexe.d.ts → calculate-Tc1WkIxl.d.ts} +1 -1
  6. package/dist/{chunk-QAWP6PEK.js → chunk-CUP5Y2ZG.js} +495 -154
  7. package/dist/{chunk-55DQUWLA.js → chunk-QAIA5KAO.js} +33 -22
  8. package/dist/{chunk-BMN6M2VL.js → chunk-SL4EZ2NU.js} +49 -34
  9. package/dist/{chunk-LY5GT7Q2.mjs → chunk-TW4BCTKD.mjs} +19 -4
  10. package/dist/{chunk-KDANGDDL.mjs → chunk-VBU6B7II.mjs} +13 -2
  11. package/dist/{chunk-A5WIFECI.js → chunk-VJJIA3HC.js} +7 -3
  12. package/dist/{chunk-7ZM5LVH2.mjs → chunk-Z6CWRR74.mjs} +426 -85
  13. package/dist/{chunk-76RTO6EO.mjs → chunk-ZYNFVPDS.mjs} +7 -3
  14. package/dist/core.d.mts +5 -5
  15. package/dist/core.d.ts +5 -5
  16. package/dist/core.js +67 -67
  17. package/dist/core.mjs +2 -2
  18. package/dist/extras.d.mts +2 -2
  19. package/dist/extras.d.ts +2 -2
  20. package/dist/extras.js +8 -8
  21. package/dist/extras.mjs +1 -1
  22. package/dist/index.d.mts +5 -5
  23. package/dist/index.d.ts +5 -5
  24. package/dist/index.js +39 -39
  25. package/dist/index.mjs +4 -4
  26. package/dist/legacy.d.mts +18 -9
  27. package/dist/legacy.d.ts +18 -9
  28. package/dist/legacy.js +33 -23
  29. package/dist/legacy.mjs +16 -7
  30. package/dist/{position-CSgQSjwQ.d.ts → position-VdYnMJql.d.ts} +1 -1
  31. package/dist/{position-BV-g3Ezg.d.mts → position-iPly-ecb.d.mts} +1 -1
  32. package/dist/react.d.mts +24 -6
  33. package/dist/react.d.ts +24 -6
  34. package/dist/react.js +25 -25
  35. package/dist/react.mjs +4 -4
  36. package/dist/{responsive-BrTV_0tK.d.mts → responsive-BVtXrrTF.d.mts} +1 -1
  37. package/dist/{responsive-C_YtBQYq.d.ts → responsive-C6s9JAJU.d.ts} +1 -1
  38. package/dist/{types-jd8MiKM1.d.mts → types-DlzNckle.d.mts} +22 -0
  39. package/dist/{types-jd8MiKM1.d.ts → types-DlzNckle.d.ts} +22 -0
  40. package/package.json +3 -2
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunkA5WIFECI_js = require('./chunk-A5WIFECI.js');
3
+ var chunkVJJIA3HC_js = require('./chunk-VJJIA3HC.js');
4
4
 
5
5
  // src/core/constraints.ts
6
6
  function clamp(value, min, max) {
@@ -40,6 +40,15 @@ var containerBounds = {
40
40
  x: clamp(x, 0, Math.max(0, cols - item.w)),
41
41
  y: clamp(y, 0, Math.max(0, visibleRows - item.h))
42
42
  };
43
+ },
44
+ constrainSize(item, w, h, handle, { cols, maxRows, containerHeight, rowHeight, margin }) {
45
+ const visibleRows = containerHeight > 0 ? Math.floor((containerHeight + margin[1]) / (rowHeight + margin[1])) : maxRows;
46
+ const maxW = handle === "w" || handle === "nw" || handle === "sw" ? item.x + item.w : cols - item.x;
47
+ const maxH = handle === "n" || handle === "nw" || handle === "ne" ? item.y + item.h : visibleRows - item.y;
48
+ return {
49
+ w: clamp(w, 1, Math.max(1, maxW)),
50
+ h: clamp(h, 1, Math.max(1, maxH))
51
+ };
43
52
  }
44
53
  };
45
54
  var boundedX = {
@@ -343,7 +352,9 @@ var defaultResizeConfig = {
343
352
  };
344
353
  var defaultDropConfig = {
345
354
  enabled: false,
346
- defaultItem: { w: 1, h: 1 }
355
+ defaultItem: { w: 1, h: 1 },
356
+ touchEnabled: true,
357
+ touchDragSource: "[data-rgl-draggable]"
347
358
  };
348
359
 
349
360
  // src/core/compactors.ts
@@ -351,13 +362,13 @@ function resolveCompactionCollision(layout, item, moveToCoord, axis, hasStatics)
351
362
  const sizeProp = axis === "x" ? "w" : "h";
352
363
  item[axis] += 1;
353
364
  const itemIndex = layout.findIndex((l) => l.i === item.i);
354
- const layoutHasStatics = hasStatics ?? chunkA5WIFECI_js.getStatics(layout).length > 0;
365
+ const layoutHasStatics = hasStatics ?? chunkVJJIA3HC_js.getStatics(layout).length > 0;
355
366
  for (let i = itemIndex + 1; i < layout.length; i++) {
356
367
  const otherItem = layout[i];
357
368
  if (otherItem === void 0) continue;
358
369
  if (otherItem.static) continue;
359
370
  if (!layoutHasStatics && otherItem.y > item.y + item.h) break;
360
- if (chunkA5WIFECI_js.collides(item, otherItem)) {
371
+ if (chunkVJJIA3HC_js.collides(item, otherItem)) {
361
372
  resolveCompactionCollision(
362
373
  layout,
363
374
  otherItem,
@@ -373,11 +384,11 @@ function compactItemVertical(compareWith, l, fullLayout, maxY) {
373
384
  l.x = Math.max(l.x, 0);
374
385
  l.y = Math.max(l.y, 0);
375
386
  l.y = Math.min(maxY, l.y);
376
- while (l.y > 0 && !chunkA5WIFECI_js.getFirstCollision(compareWith, l)) {
387
+ while (l.y > 0 && !chunkVJJIA3HC_js.getFirstCollision(compareWith, l)) {
377
388
  l.y--;
378
389
  }
379
390
  let collision;
380
- while ((collision = chunkA5WIFECI_js.getFirstCollision(compareWith, l)) !== void 0) {
391
+ while ((collision = chunkVJJIA3HC_js.getFirstCollision(compareWith, l)) !== void 0) {
381
392
  resolveCompactionCollision(fullLayout, l, collision.y + collision.h, "y");
382
393
  }
383
394
  l.y = Math.max(l.y, 0);
@@ -386,16 +397,16 @@ function compactItemVertical(compareWith, l, fullLayout, maxY) {
386
397
  function compactItemHorizontal(compareWith, l, cols, fullLayout) {
387
398
  l.x = Math.max(l.x, 0);
388
399
  l.y = Math.max(l.y, 0);
389
- while (l.x > 0 && !chunkA5WIFECI_js.getFirstCollision(compareWith, l)) {
400
+ while (l.x > 0 && !chunkVJJIA3HC_js.getFirstCollision(compareWith, l)) {
390
401
  l.x--;
391
402
  }
392
403
  let collision;
393
- while ((collision = chunkA5WIFECI_js.getFirstCollision(compareWith, l)) !== void 0) {
404
+ while ((collision = chunkVJJIA3HC_js.getFirstCollision(compareWith, l)) !== void 0) {
394
405
  resolveCompactionCollision(fullLayout, l, collision.x + collision.w, "x");
395
406
  if (l.x + l.w > cols) {
396
407
  l.x = cols - l.w;
397
408
  l.y++;
398
- while (l.x > 0 && !chunkA5WIFECI_js.getFirstCollision(compareWith, l)) {
409
+ while (l.x > 0 && !chunkVJJIA3HC_js.getFirstCollision(compareWith, l)) {
399
410
  l.x--;
400
411
  }
401
412
  }
@@ -407,14 +418,14 @@ var verticalCompactor = {
407
418
  type: "vertical",
408
419
  allowOverlap: false,
409
420
  compact(layout, _cols) {
410
- const compareWith = chunkA5WIFECI_js.getStatics(layout);
411
- let maxY = chunkA5WIFECI_js.bottom(compareWith);
412
- const sorted = chunkA5WIFECI_js.sortLayoutItemsByRowCol(layout);
421
+ const compareWith = chunkVJJIA3HC_js.getStatics(layout);
422
+ let maxY = chunkVJJIA3HC_js.bottom(compareWith);
423
+ const sorted = chunkVJJIA3HC_js.sortLayoutItemsByRowCol(layout);
413
424
  const out = new Array(layout.length);
414
425
  for (let i = 0; i < sorted.length; i++) {
415
426
  const sortedItem = sorted[i];
416
427
  if (sortedItem === void 0) continue;
417
- let l = chunkA5WIFECI_js.cloneLayoutItem(sortedItem);
428
+ let l = chunkVJJIA3HC_js.cloneLayoutItem(sortedItem);
418
429
  if (!l.static) {
419
430
  l = compactItemVertical(compareWith, l, sorted, maxY);
420
431
  maxY = Math.max(maxY, l.y + l.h);
@@ -431,13 +442,13 @@ var horizontalCompactor = {
431
442
  type: "horizontal",
432
443
  allowOverlap: false,
433
444
  compact(layout, cols) {
434
- const compareWith = chunkA5WIFECI_js.getStatics(layout);
435
- const sorted = chunkA5WIFECI_js.sortLayoutItemsByColRow(layout);
445
+ const compareWith = chunkVJJIA3HC_js.getStatics(layout);
446
+ const sorted = chunkVJJIA3HC_js.sortLayoutItemsByColRow(layout);
436
447
  const out = new Array(layout.length);
437
448
  for (let i = 0; i < sorted.length; i++) {
438
449
  const sortedItem = sorted[i];
439
450
  if (sortedItem === void 0) continue;
440
- let l = chunkA5WIFECI_js.cloneLayoutItem(sortedItem);
451
+ let l = chunkVJJIA3HC_js.cloneLayoutItem(sortedItem);
441
452
  if (!l.static) {
442
453
  l = compactItemHorizontal(compareWith, l, cols, sorted);
443
454
  compareWith.push(l);
@@ -453,21 +464,21 @@ var noCompactor = {
453
464
  type: null,
454
465
  allowOverlap: false,
455
466
  compact(layout, _cols) {
456
- return chunkA5WIFECI_js.cloneLayout(layout);
467
+ return chunkVJJIA3HC_js.cloneLayout(layout);
457
468
  }
458
469
  };
459
470
  var verticalOverlapCompactor = {
460
471
  ...verticalCompactor,
461
472
  allowOverlap: true,
462
473
  compact(layout, _cols) {
463
- return chunkA5WIFECI_js.cloneLayout(layout);
474
+ return chunkVJJIA3HC_js.cloneLayout(layout);
464
475
  }
465
476
  };
466
477
  var horizontalOverlapCompactor = {
467
478
  ...horizontalCompactor,
468
479
  allowOverlap: true,
469
480
  compact(layout, _cols) {
470
- return chunkA5WIFECI_js.cloneLayout(layout);
481
+ return chunkVJJIA3HC_js.cloneLayout(layout);
471
482
  }
472
483
  };
473
484
  var noOverlapCompactor = {
@@ -525,7 +536,7 @@ function getColsFromBreakpoint(breakpoint, cols) {
525
536
  function findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, compactTypeOrCompactor) {
526
537
  const existingLayout = layouts[breakpoint];
527
538
  if (existingLayout) {
528
- return chunkA5WIFECI_js.cloneLayout(existingLayout);
539
+ return chunkVJJIA3HC_js.cloneLayout(existingLayout);
529
540
  }
530
541
  let layout = layouts[lastBreakpoint];
531
542
  const breakpointsSorted = sortBreakpoints(breakpoints);
@@ -541,8 +552,8 @@ function findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBr
541
552
  break;
542
553
  }
543
554
  }
544
- const clonedLayout = chunkA5WIFECI_js.cloneLayout(layout || []);
545
- const corrected = chunkA5WIFECI_js.correctBounds(clonedLayout, { cols });
555
+ const clonedLayout = chunkVJJIA3HC_js.cloneLayout(layout || []);
556
+ const corrected = chunkVJJIA3HC_js.correctBounds(clonedLayout, { cols });
546
557
  const compactor = typeof compactTypeOrCompactor === "object" && compactTypeOrCompactor !== null ? compactTypeOrCompactor : getCompactor(compactTypeOrCompactor);
547
558
  return compactor.compact(corrected, cols);
548
559
  }
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var chunk55DQUWLA_js = require('./chunk-55DQUWLA.js');
4
- var chunkA5WIFECI_js = require('./chunk-A5WIFECI.js');
3
+ var chunkQAIA5KAO_js = require('./chunk-QAIA5KAO.js');
4
+ var chunkVJJIA3HC_js = require('./chunk-VJJIA3HC.js');
5
5
  var react = require('react');
6
6
  var fastEquals = require('fast-equals');
7
7
 
@@ -20,7 +20,11 @@ function getContentWidth(node) {
20
20
  );
21
21
  }
22
22
  function useContainerWidth(options = {}) {
23
- const { measureBeforeMount = false, initialWidth = 1280 } = options;
23
+ const {
24
+ measureBeforeMount = false,
25
+ initialWidth = 1280,
26
+ debounceTimeout
27
+ } = options;
24
28
  const [width, setWidth] = react.useState(initialWidth);
25
29
  const [mounted, setMounted] = react.useState(!measureBeforeMount);
26
30
  const containerRef = react.useRef(null);
@@ -41,10 +45,19 @@ function useContainerWidth(options = {}) {
41
45
  measureWidth();
42
46
  if (typeof ResizeObserver !== "undefined") {
43
47
  let rafId = null;
48
+ let debounceTimer;
44
49
  observerRef.current = new ResizeObserver((entries) => {
45
50
  const entry = entries[0];
46
51
  if (entry) {
47
52
  const newWidth = Math.round(entry.contentRect.width);
53
+ if (debounceTimeout && debounceTimeout > 0) {
54
+ window.clearTimeout(debounceTimer);
55
+ debounceTimer = window.setTimeout(() => {
56
+ setWidth((prev) => prev === newWidth ? prev : newWidth);
57
+ debounceTimer = void 0;
58
+ }, debounceTimeout);
59
+ return;
60
+ }
48
61
  if (rafId !== null) {
49
62
  cancelAnimationFrame(rafId);
50
63
  }
@@ -59,6 +72,8 @@ function useContainerWidth(options = {}) {
59
72
  if (rafId !== null) {
60
73
  cancelAnimationFrame(rafId);
61
74
  }
75
+ window.clearTimeout(debounceTimer);
76
+ debounceTimer = void 0;
62
77
  if (observerRef.current) {
63
78
  observerRef.current.disconnect();
64
79
  observerRef.current = null;
@@ -71,7 +86,7 @@ function useContainerWidth(options = {}) {
71
86
  observerRef.current = null;
72
87
  }
73
88
  };
74
- }, [measureWidth]);
89
+ }, [measureWidth, debounceTimeout]);
75
90
  return {
76
91
  width,
77
92
  mounted,
@@ -85,11 +100,11 @@ function useGridLayout(options) {
85
100
  cols,
86
101
  preventCollision = false,
87
102
  onLayoutChange,
88
- compactor = chunk55DQUWLA_js.verticalCompactor
103
+ compactor = chunkQAIA5KAO_js.verticalCompactor
89
104
  } = options;
90
105
  const isDraggingRef = react.useRef(false);
91
106
  const [layout, setLayoutState] = react.useState(() => {
92
- const corrected = chunkA5WIFECI_js.correctBounds(chunkA5WIFECI_js.cloneLayout(propsLayout), { cols });
107
+ const corrected = chunkVJJIA3HC_js.correctBounds(chunkVJJIA3HC_js.cloneLayout(propsLayout), { cols });
93
108
  return compactor.compact(corrected, cols);
94
109
  });
95
110
  const [dragState, setDragState] = react.useState({
@@ -109,7 +124,7 @@ function useGridLayout(options) {
109
124
  const prevLayoutRef = react.useRef(layout);
110
125
  const setLayout = react.useCallback(
111
126
  (newLayout) => {
112
- const corrected = chunkA5WIFECI_js.correctBounds(chunkA5WIFECI_js.cloneLayout(newLayout), { cols });
127
+ const corrected = chunkVJJIA3HC_js.correctBounds(chunkVJJIA3HC_js.cloneLayout(newLayout), { cols });
113
128
  const compacted = compactor.compact(corrected, cols);
114
129
  setLayoutState(compacted);
115
130
  },
@@ -129,11 +144,11 @@ function useGridLayout(options) {
129
144
  }, [layout, onLayoutChange]);
130
145
  const onDragStart = react.useCallback(
131
146
  (itemId, x, y) => {
132
- const item = chunkA5WIFECI_js.getLayoutItem(layout, itemId);
147
+ const item = chunkVJJIA3HC_js.getLayoutItem(layout, itemId);
133
148
  if (!item) return null;
134
149
  isDraggingRef.current = true;
135
150
  const placeholder = {
136
- ...chunkA5WIFECI_js.cloneLayoutItem(item),
151
+ ...chunkVJJIA3HC_js.cloneLayoutItem(item),
137
152
  x,
138
153
  y,
139
154
  static: false,
@@ -141,8 +156,8 @@ function useGridLayout(options) {
141
156
  };
142
157
  setDragState({
143
158
  activeDrag: placeholder,
144
- oldDragItem: chunkA5WIFECI_js.cloneLayoutItem(item),
145
- oldLayout: chunkA5WIFECI_js.cloneLayout(layout)
159
+ oldDragItem: chunkVJJIA3HC_js.cloneLayoutItem(item),
160
+ oldLayout: chunkVJJIA3HC_js.cloneLayout(layout)
146
161
  });
147
162
  return placeholder;
148
163
  },
@@ -150,13 +165,13 @@ function useGridLayout(options) {
150
165
  );
151
166
  const onDrag = react.useCallback(
152
167
  (itemId, x, y) => {
153
- const item = chunkA5WIFECI_js.getLayoutItem(layout, itemId);
168
+ const item = chunkVJJIA3HC_js.getLayoutItem(layout, itemId);
154
169
  if (!item) return;
155
170
  setDragState((prev) => ({
156
171
  ...prev,
157
172
  activeDrag: prev.activeDrag ? { ...prev.activeDrag, x, y } : null
158
173
  }));
159
- const newLayout = chunkA5WIFECI_js.moveElement(
174
+ const newLayout = chunkVJJIA3HC_js.moveElement(
160
175
  layout,
161
176
  item,
162
177
  x,
@@ -175,9 +190,9 @@ function useGridLayout(options) {
175
190
  );
176
191
  const onDragStop = react.useCallback(
177
192
  (itemId, x, y) => {
178
- const item = chunkA5WIFECI_js.getLayoutItem(layout, itemId);
193
+ const item = chunkVJJIA3HC_js.getLayoutItem(layout, itemId);
179
194
  if (!item) return;
180
- const newLayout = chunkA5WIFECI_js.moveElement(
195
+ const newLayout = chunkVJJIA3HC_js.moveElement(
181
196
  layout,
182
197
  item,
183
198
  x,
@@ -201,12 +216,12 @@ function useGridLayout(options) {
201
216
  );
202
217
  const onResizeStart = react.useCallback(
203
218
  (itemId) => {
204
- const item = chunkA5WIFECI_js.getLayoutItem(layout, itemId);
219
+ const item = chunkVJJIA3HC_js.getLayoutItem(layout, itemId);
205
220
  if (!item) return null;
206
221
  setResizeState({
207
222
  resizing: true,
208
- oldResizeItem: chunkA5WIFECI_js.cloneLayoutItem(item),
209
- oldLayout: chunkA5WIFECI_js.cloneLayout(layout)
223
+ oldResizeItem: chunkVJJIA3HC_js.cloneLayoutItem(item),
224
+ oldLayout: chunkVJJIA3HC_js.cloneLayout(layout)
210
225
  });
211
226
  return item;
212
227
  },
@@ -227,7 +242,7 @@ function useGridLayout(options) {
227
242
  }
228
243
  return item;
229
244
  });
230
- const corrected = chunkA5WIFECI_js.correctBounds(newLayout, { cols });
245
+ const corrected = chunkVJJIA3HC_js.correctBounds(newLayout, { cols });
231
246
  const compacted = compactor.compact(corrected, cols);
232
247
  setLayoutState(compacted);
233
248
  },
@@ -246,10 +261,10 @@ function useGridLayout(options) {
246
261
  );
247
262
  const onDropDragOver = react.useCallback(
248
263
  (droppingItem, position) => {
249
- const existingItem = chunkA5WIFECI_js.getLayoutItem(layout, droppingItem.i);
264
+ const existingItem = chunkVJJIA3HC_js.getLayoutItem(layout, droppingItem.i);
250
265
  if (!existingItem) {
251
266
  const newLayout = [...layout, droppingItem];
252
- const corrected = chunkA5WIFECI_js.correctBounds(newLayout, { cols });
267
+ const corrected = chunkVJJIA3HC_js.correctBounds(newLayout, { cols });
253
268
  const compacted = compactor.compact(corrected, cols);
254
269
  setLayoutState(compacted);
255
270
  }
@@ -281,7 +296,7 @@ function useGridLayout(options) {
281
296
  }
282
297
  return item;
283
298
  });
284
- const corrected = chunkA5WIFECI_js.correctBounds(newLayout, { cols });
299
+ const corrected = chunkVJJIA3HC_js.correctBounds(newLayout, { cols });
285
300
  const compacted = compactor.compact(corrected, cols);
286
301
  setLayoutState(compacted);
287
302
  setDropState({
@@ -291,7 +306,7 @@ function useGridLayout(options) {
291
306
  },
292
307
  [layout, cols, compactor]
293
308
  );
294
- const containerHeight = react.useMemo(() => chunkA5WIFECI_js.bottom(layout), [layout]);
309
+ const containerHeight = react.useMemo(() => chunkVJJIA3HC_js.bottom(layout), [layout]);
295
310
  const isInteracting = dragState.activeDrag !== null || resizeState.resizing || dropState.droppingPosition !== null;
296
311
  return {
297
312
  layout,
@@ -333,23 +348,23 @@ function useResponsiveLayout(options) {
333
348
  breakpoints = DEFAULT_BREAKPOINTS,
334
349
  cols: colsConfig = DEFAULT_COLS,
335
350
  layouts: propsLayouts = {},
336
- compactor = chunk55DQUWLA_js.verticalCompactor,
351
+ compactor = chunkQAIA5KAO_js.verticalCompactor,
337
352
  onBreakpointChange,
338
353
  onLayoutChange,
339
354
  onWidthChange
340
355
  } = options;
341
356
  const sortedBreakpoints = react.useMemo(
342
- () => chunk55DQUWLA_js.sortBreakpoints(breakpoints),
357
+ () => chunkQAIA5KAO_js.sortBreakpoints(breakpoints),
343
358
  [breakpoints]
344
359
  );
345
360
  const initialBreakpoint = react.useMemo(
346
- () => chunk55DQUWLA_js.getBreakpointFromWidth(breakpoints, width),
361
+ () => chunkQAIA5KAO_js.getBreakpointFromWidth(breakpoints, width),
347
362
  // Only calculate on mount, not on width changes
348
363
  // eslint-disable-next-line react-hooks/exhaustive-deps
349
364
  []
350
365
  );
351
366
  const initialCols = react.useMemo(
352
- () => chunk55DQUWLA_js.getColsFromBreakpoint(initialBreakpoint, colsConfig),
367
+ () => chunkQAIA5KAO_js.getColsFromBreakpoint(initialBreakpoint, colsConfig),
353
368
  [initialBreakpoint, colsConfig]
354
369
  );
355
370
  const [breakpoint, setBreakpoint] = react.useState(initialBreakpoint);
@@ -359,7 +374,7 @@ function useResponsiveLayout(options) {
359
374
  for (const bp of sortedBreakpoints) {
360
375
  const layout2 = propsLayouts[bp];
361
376
  if (layout2) {
362
- cloned[bp] = chunkA5WIFECI_js.cloneLayout(layout2);
377
+ cloned[bp] = chunkVJJIA3HC_js.cloneLayout(layout2);
363
378
  }
364
379
  }
365
380
  return cloned;
@@ -369,7 +384,7 @@ function useResponsiveLayout(options) {
369
384
  const prevPropsLayoutsRef = react.useRef(propsLayouts);
370
385
  const prevLayoutsRef = react.useRef(layouts);
371
386
  const layout = react.useMemo(() => {
372
- return chunk55DQUWLA_js.findOrGenerateResponsiveLayout(
387
+ return chunkQAIA5KAO_js.findOrGenerateResponsiveLayout(
373
388
  layouts,
374
389
  breakpoints,
375
390
  breakpoint,
@@ -381,7 +396,7 @@ function useResponsiveLayout(options) {
381
396
  const setLayoutForBreakpoint = react.useCallback((bp, newLayout) => {
382
397
  setLayoutsState((prev) => ({
383
398
  ...prev,
384
- [bp]: chunkA5WIFECI_js.cloneLayout(newLayout)
399
+ [bp]: chunkVJJIA3HC_js.cloneLayout(newLayout)
385
400
  }));
386
401
  }, []);
387
402
  const setLayouts = react.useCallback((newLayouts) => {
@@ -389,7 +404,7 @@ function useResponsiveLayout(options) {
389
404
  for (const bp of Object.keys(newLayouts)) {
390
405
  const layoutForBp = newLayouts[bp];
391
406
  if (layoutForBp) {
392
- cloned[bp] = chunkA5WIFECI_js.cloneLayout(layoutForBp);
407
+ cloned[bp] = chunkVJJIA3HC_js.cloneLayout(layoutForBp);
393
408
  }
394
409
  }
395
410
  setLayoutsState(cloned);
@@ -397,11 +412,11 @@ function useResponsiveLayout(options) {
397
412
  react.useEffect(() => {
398
413
  if (prevWidthRef.current === width) return;
399
414
  prevWidthRef.current = width;
400
- const newBreakpoint = chunk55DQUWLA_js.getBreakpointFromWidth(breakpoints, width);
401
- const newCols = chunk55DQUWLA_js.getColsFromBreakpoint(newBreakpoint, colsConfig);
415
+ const newBreakpoint = chunkQAIA5KAO_js.getBreakpointFromWidth(breakpoints, width);
416
+ const newCols = chunkQAIA5KAO_js.getColsFromBreakpoint(newBreakpoint, colsConfig);
402
417
  onWidthChange?.(width, [10, 10], newCols, null);
403
418
  if (newBreakpoint !== breakpoint) {
404
- const newLayout = chunk55DQUWLA_js.findOrGenerateResponsiveLayout(
419
+ const newLayout = chunkQAIA5KAO_js.findOrGenerateResponsiveLayout(
405
420
  layouts,
406
421
  breakpoints,
407
422
  newBreakpoint,
@@ -1,5 +1,5 @@
1
- import { verticalCompactor, sortBreakpoints, getBreakpointFromWidth, getColsFromBreakpoint, findOrGenerateResponsiveLayout } from './chunk-KDANGDDL.mjs';
2
- import { correctBounds, cloneLayout, getLayoutItem, cloneLayoutItem, moveElement, bottom } from './chunk-76RTO6EO.mjs';
1
+ import { verticalCompactor, sortBreakpoints, getBreakpointFromWidth, getColsFromBreakpoint, findOrGenerateResponsiveLayout } from './chunk-VBU6B7II.mjs';
2
+ import { correctBounds, cloneLayout, getLayoutItem, cloneLayoutItem, moveElement, bottom } from './chunk-ZYNFVPDS.mjs';
3
3
  import { useState, useRef, useCallback, useEffect, useMemo } from 'react';
4
4
  import { deepEqual } from 'fast-equals';
5
5
 
@@ -18,7 +18,11 @@ function getContentWidth(node) {
18
18
  );
19
19
  }
20
20
  function useContainerWidth(options = {}) {
21
- const { measureBeforeMount = false, initialWidth = 1280 } = options;
21
+ const {
22
+ measureBeforeMount = false,
23
+ initialWidth = 1280,
24
+ debounceTimeout
25
+ } = options;
22
26
  const [width, setWidth] = useState(initialWidth);
23
27
  const [mounted, setMounted] = useState(!measureBeforeMount);
24
28
  const containerRef = useRef(null);
@@ -39,10 +43,19 @@ function useContainerWidth(options = {}) {
39
43
  measureWidth();
40
44
  if (typeof ResizeObserver !== "undefined") {
41
45
  let rafId = null;
46
+ let debounceTimer;
42
47
  observerRef.current = new ResizeObserver((entries) => {
43
48
  const entry = entries[0];
44
49
  if (entry) {
45
50
  const newWidth = Math.round(entry.contentRect.width);
51
+ if (debounceTimeout && debounceTimeout > 0) {
52
+ window.clearTimeout(debounceTimer);
53
+ debounceTimer = window.setTimeout(() => {
54
+ setWidth((prev) => prev === newWidth ? prev : newWidth);
55
+ debounceTimer = void 0;
56
+ }, debounceTimeout);
57
+ return;
58
+ }
46
59
  if (rafId !== null) {
47
60
  cancelAnimationFrame(rafId);
48
61
  }
@@ -57,6 +70,8 @@ function useContainerWidth(options = {}) {
57
70
  if (rafId !== null) {
58
71
  cancelAnimationFrame(rafId);
59
72
  }
73
+ window.clearTimeout(debounceTimer);
74
+ debounceTimer = void 0;
60
75
  if (observerRef.current) {
61
76
  observerRef.current.disconnect();
62
77
  observerRef.current = null;
@@ -69,7 +84,7 @@ function useContainerWidth(options = {}) {
69
84
  observerRef.current = null;
70
85
  }
71
86
  };
72
- }, [measureWidth]);
87
+ }, [measureWidth, debounceTimeout]);
73
88
  return {
74
89
  width,
75
90
  mounted,
@@ -1,4 +1,4 @@
1
- import { getStatics, collides, getFirstCollision, bottom, sortLayoutItemsByRowCol, cloneLayoutItem, sortLayoutItemsByColRow, cloneLayout, correctBounds } from './chunk-76RTO6EO.mjs';
1
+ import { getStatics, collides, getFirstCollision, bottom, sortLayoutItemsByRowCol, cloneLayoutItem, sortLayoutItemsByColRow, cloneLayout, correctBounds } from './chunk-ZYNFVPDS.mjs';
2
2
 
3
3
  // src/core/constraints.ts
4
4
  function clamp(value, min, max) {
@@ -38,6 +38,15 @@ var containerBounds = {
38
38
  x: clamp(x, 0, Math.max(0, cols - item.w)),
39
39
  y: clamp(y, 0, Math.max(0, visibleRows - item.h))
40
40
  };
41
+ },
42
+ constrainSize(item, w, h, handle, { cols, maxRows, containerHeight, rowHeight, margin }) {
43
+ const visibleRows = containerHeight > 0 ? Math.floor((containerHeight + margin[1]) / (rowHeight + margin[1])) : maxRows;
44
+ const maxW = handle === "w" || handle === "nw" || handle === "sw" ? item.x + item.w : cols - item.x;
45
+ const maxH = handle === "n" || handle === "nw" || handle === "ne" ? item.y + item.h : visibleRows - item.y;
46
+ return {
47
+ w: clamp(w, 1, Math.max(1, maxW)),
48
+ h: clamp(h, 1, Math.max(1, maxH))
49
+ };
41
50
  }
42
51
  };
43
52
  var boundedX = {
@@ -341,7 +350,9 @@ var defaultResizeConfig = {
341
350
  };
342
351
  var defaultDropConfig = {
343
352
  enabled: false,
344
- defaultItem: { w: 1, h: 1 }
353
+ defaultItem: { w: 1, h: 1 },
354
+ touchEnabled: true,
355
+ touchDragSource: "[data-rgl-draggable]"
345
356
  };
346
357
 
347
358
  // src/core/compactors.ts
@@ -268,6 +268,9 @@ function correctBounds(layout, bounds) {
268
268
  l.x = 0;
269
269
  l.w = bounds.cols;
270
270
  }
271
+ if (l.y === Infinity) {
272
+ l.y = bottom(collidesWith);
273
+ }
271
274
  if (!l.static) {
272
275
  collidesWith.push(l);
273
276
  } else {
@@ -330,7 +333,7 @@ function moveElement(layout, l, x, y, isUserAction, preventCollision, compactTyp
330
333
  return resultLayout;
331
334
  }
332
335
  function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction, compactType, cols) {
333
- const compactH = compactType === "horizontal";
336
+ const compactH = compactType === "horizontal" || compactType === "wrap";
334
337
  const compactV = compactType === "vertical";
335
338
  const preventCollision = collidesWith.static;
336
339
  if (isUserAction) {
@@ -366,8 +369,9 @@ function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAc
366
369
  compactType);
367
370
  }
368
371
  if (collisionNorth && compactType === null) {
369
- collidesWith.y = itemToMove.y;
370
- itemToMove.y = itemToMove.y + itemToMove.h;
372
+ const newCollidesY = itemToMove.y;
373
+ collidesWith.y = newCollidesY;
374
+ itemToMove.y = newCollidesY + collidesWith.h;
371
375
  return [...layout];
372
376
  }
373
377
  if (collisionWest && compactH) {