From e9a285cf5684c9f1268c1342f26f58afefe4ce4f Mon Sep 17 00:00:00 2001
From: Marvin <sanchezmarvin38@gmail.com>
Date: Sun, 22 Jan 2023 18:24:00 +0100
Subject: [PATCH 1/2] feat: max rows

---
 src/MoveResize/index.svelte | 8 ++++++--
 src/index.svelte            | 2 ++
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/MoveResize/index.svelte b/src/MoveResize/index.svelte
index 68539d4..0100c79 100644
--- a/src/MoveResize/index.svelte
+++ b/src/MoveResize/index.svelte
@@ -62,7 +62,7 @@
   on:pointerdown={item && item.customDragger ? null : draggable && pointerdown}
   class="svlt-grid-item"
   class:svlt-grid-active={active || (trans && rect)}
-  style="width: {active ? newSize.width : width}px; height:{active ? newSize.height : height}px; 
+  style="width: {active ? newSize.width : width}px; height:{active ? newSize.height : height}px;
   {active ? `transform: translate(${cordDiff.x}px, ${cordDiff.y}px);top:${rect.top}px;left:${rect.left}px;` : trans ? `transform: translate(${cordDiff.x}px, ${cordDiff.y}px); position:absolute; transition: width 0.2s, height 0.2s;` : `transition: transform 0.2s, opacity 0.2s; transform: translate(${left}px, ${top}px); `} ">
   <slot movePointerDown={pointerdown} {resizePointerDown} />
   {#if resizable && !item.customResizer}
@@ -100,6 +100,7 @@
 
   export let max;
   export let min;
+	export let maxY;
 
   export let cols;
 
@@ -233,7 +234,10 @@
     event.stopPropagation();
     event.stopImmediatePropagation();
 
-    const { clientX, clientY } = event;
+    let { clientX, clientY } = event;
+		if (clientY >= maxY) {
+			clientY = maxY;
+		}
     cordDiff = { x: clientX - initX, y: clientY - initY };
 
     const Y_SENSOR = sensor;
diff --git a/src/index.svelte b/src/index.svelte
index 401a890..f3ea2b5 100644
--- a/src/index.svelte
+++ b/src/index.svelte
@@ -23,6 +23,7 @@
         item={item[getComputedCols]}
         min={item[getComputedCols] && item[getComputedCols].min}
         max={item[getComputedCols] && item[getComputedCols].max}
+				maxY={maxRows ? rowHeight * (maxRows - 1) : null}
         cols={getComputedCols}
         {gapX}
         {gapY}
@@ -57,6 +58,7 @@
   export let fastStart = false;
   export let throttleUpdate = 100;
   export let throttleResize = 100;
+	export let maxRows;
 
   export let scroller = undefined;
   export let sensor = 20;

From cf30f20241662f499e52ee92e08ee4eb3298edcc Mon Sep 17 00:00:00 2001
From: Marvin <sanchezmarvin38@gmail.com>
Date: Sun, 22 Jan 2023 20:05:46 +0100
Subject: [PATCH 2/2] fix: better bounds handlement on move + limit resize
 movement

---
 src/MoveResize/index.svelte | 28 +++++++++++++++++++++++++---
 src/index.svelte            |  3 ++-
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/src/MoveResize/index.svelte b/src/MoveResize/index.svelte
index 0100c79..c6248e0 100644
--- a/src/MoveResize/index.svelte
+++ b/src/MoveResize/index.svelte
@@ -100,7 +100,8 @@
 
   export let max;
   export let min;
-	export let maxY;
+	export let maxRows;
+	export let rowHeight;
 
   export let cols;
 
@@ -124,6 +125,7 @@
   let trans = false;
 
   let anima;
+  let maxY;
 
   const inActivate = () => {
     const shadowBound = shadowElement.getBoundingClientRect();
@@ -177,10 +179,22 @@
 
   const getScroller = (element) => (!element ? document.documentElement : element);
 
+  function getHeightDifference() {
+    const {y: itemY, h: itemHeight } = item;
+    const itemBottomIndex = itemY + itemHeight;
+
+    return maxRows - itemBottomIndex;
+  }
+
   const pointerdown = ({ clientX, clientY, target }) => {
     initX = clientX;
     initY = clientY;
 
+    if (maxRows) {
+      const diff = getHeightDifference();
+      maxY = initY + rowHeight * diff;
+    }
+
     capturePos = { x: left, y: top };
     shadow = { x: item.x, y: item.y, w: item.w, h: item.h };
     newSize = { width, height };
@@ -233,9 +247,9 @@
     event.preventDefault();
     event.stopPropagation();
     event.stopImmediatePropagation();
-
     let { clientX, clientY } = event;
-		if (clientY >= maxY) {
+
+		if (maxRows && clientY >= maxY) {
 			clientY = maxY;
 		}
     cordDiff = { x: clientX - initX, y: clientY - initY };
@@ -307,6 +321,9 @@
     newSize.width = initSize.width + pageX - resizeInitPos.x;
     newSize.height = initSize.height + pageY - resizeInitPos.y;
 
+    const diff = getHeightDifference();
+    const maxHeight = diff * rowHeight + item.h * rowHeight;
+
     // Get max col number
     let maxWidth = cols - shadow.x;
     maxWidth = Math.min(max.w, maxWidth) || maxWidth;
@@ -319,6 +336,11 @@
     if (max.h) {
       newSize.height = Math.min(newSize.height, max.h * yPerPx - gapY * 2);
     }
+
+    if (newSize.height > maxHeight) {
+      newSize.height = maxHeight;
+    }
+
     // Limit col & row
     shadow.w = Math.round((newSize.width + gapX * 2) / xPerPx);
     shadow.h = Math.round((newSize.height + gapY * 2) / yPerPx);
diff --git a/src/index.svelte b/src/index.svelte
index f3ea2b5..1a9a466 100644
--- a/src/index.svelte
+++ b/src/index.svelte
@@ -23,11 +23,12 @@
         item={item[getComputedCols]}
         min={item[getComputedCols] && item[getComputedCols].min}
         max={item[getComputedCols] && item[getComputedCols].max}
-				maxY={maxRows ? rowHeight * (maxRows - 1) : null}
         cols={getComputedCols}
         {gapX}
         {gapY}
         {sensor}
+        {maxRows}
+        {rowHeight}
         container={scroller}
         nativeContainer={container}
         let:resizePointerDown