refactor(resize-control): handle min max width + aspect ratio

examples/vite-app/src/examples/NodeResizer/index.tsx

@@ -45,7 +45,14 @@ const initialNodes: Node[] = [
   {
     id: '1b',
     type: 'defaultResizer',
-    data: { label: 'default resizer with initial size and aspect ratio', keepAspectRatio: true },
+    data: {
+      label: 'default resizer with initial size and aspect ratio',
+      keepAspectRatio: true,
+      minWidth: 100,
+      minHeight: 60,
+      maxWidth: 400,
+      maxHeight: 400,
+    },
     position: { x: 250, y: 0 },
     style: {
       width: 174,
@@ -82,7 +89,13 @@ const initialNodes: Node[] = [
   {
     id: '4',
     type: 'horizontalResizer',
-    data: { label: 'horizontal resizer with aspect ratio', keepAspectRatio: true },
+    data: {
+      label: 'horizontal resizer with aspect ratio',
+      keepAspectRatio: true,
+      minHeight: 20,
+      maxHeight: 80,
+      maxWidth: 300,
+    },
     position: { x: 250, y: 300 },
     style: { ...nodeStyle },
   },

packages/node-resizer/src/ResizeControl.tsx

@@ -118,6 +118,22 @@ function ResizeControl({
 
             width = (nextAspectRatio <= aspectRatio && isDiagonal) || isVertical ? height * aspectRatio : width;
             height = (nextAspectRatio > aspectRatio && isDiagonal) || isHorizontal ? width / aspectRatio : height;
+
+            if (width >= maxWidth) {
+              width = maxWidth;
+              height = maxWidth / aspectRatio;
+            } else if (width <= minWidth) {
+              width = minWidth;
+              height = minWidth / aspectRatio;
+            }
+
+            if (height >= maxHeight) {
+              height = maxHeight;
+              width = maxHeight * aspectRatio;
+            } else if (height <= minHeight) {
+              height = minHeight;
+              width = minHeight * aspectRatio;
+            }
           }
 
           const isWidthChange = width !== prevWidth;