FIX: 计算时宽高取绝对值

Author: WeiWang120

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-resizable-rotatable-draggable",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "description": "A rectangle react component which can be resized and rotated",
   "author": "MockingBot",
   "license": "MIT",

src/index.example.js

@@ -56,8 +56,8 @@ handleRotateStart = () => console.log("start")
         <ResizableRect
           {...{ left, top, width, height, rotateAngle }}
           // aspectRatio={false}
-          // minWidth={-Infinity}
-          // minHeight={-Infinity}
+          minWidth={-Infinity}
+          minHeight={-Infinity}
           zoomable="n, w, s, e, nw, ne, se, sw"
           // rotatable={true}
           onRotateStart={this.handleRotateStart}

src/utils.js

@@ -36,6 +36,10 @@ const setHeightAndDeltaH = (height, deltaH, minHeight) => {
 
 export const getNewStyle = (type, rect, deltaW, deltaH, ratio, minWidth, minHeight) => {
   let { width, height, centerX, centerY, rotateAngle } = rect
+  const widthFlag = width < 0 ? -1 : 1
+  const heightFlag = height < 0 ? -1 : 1
+  width = Math.abs(width)
+  height = Math.abs(height)
   switch (type) {
     case 'r': {
       const widthAndDeltaW = setWidthAndDeltaW(width, deltaW, minWidth)
@@ -178,8 +182,8 @@ export const getNewStyle = (type, rect, deltaW, deltaH, ratio, minWidth, minHeig
       centerY
     },
     size: {
-      width,
-      height
+      width: width * widthFlag,
+      height: height * heightFlag
     }
   }
 }