feat: add startFixedDirection property on before event

daybrush · Jul 25, 2022 · c838c9c · c838c9c
1 parent 5ded1c1
commit c838c9c
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 4 deletions.
diff --git a/packages/react-moveable/src/react-moveable/ables/Resizable.ts b/packages/react-moveable/src/react-moveable/ables/Resizable.ts
@@ -195,6 +195,7 @@ export default {
         });
         const result = parentEvent || triggerEvent(moveable, "onResizeStart", params);
 
+        datas.startFixedDirection = datas.fixedDirection;
         if (result !== false) {
             datas.isResize = true;
             moveable.state.snapRenderInfo = {
@@ -313,6 +314,7 @@ export default {
             datas.setFixedDirection(datas.fixedDirection);
 
             triggerEvent(moveable, "onBeforeResize", fillParams<OnBeforeResize>(moveable, e, {
+                startFixedDirection: datas.startFixedDirection,
                 setFixedDirection(nextFixedDirection: number[]) {
                     datas.setFixedDirection(nextFixedDirection);
 
@@ -440,9 +442,13 @@ export default {
             setCustomDrag(e, moveable.state, inverseDelta, !!isPinch, false, "draggable"),
         ) as OnDrag;
         const transform = drag.transform;
+
+        const nextWidth = startWidth + distWidth;
+        const nextHeight = startHeight + distHeight;
+
         const params = fillParams<OnResize>(moveable, e, {
-            width: startWidth + distWidth,
-            height: startHeight + distHeight,
+            width: nextWidth,
+            height: nextHeight,
             offsetWidth: Math.round(boundingWidth),
             offsetHeight: Math.round(boundingHeight),
             startRatio: ratio,
@@ -455,8 +461,8 @@ export default {
             drag,
             ...fillAfterTransform({
                 style: {
-                    width: `${boundingWidth}px`,
-                    height: `${boundingHeight}px`,
+                    width: `${nextWidth}px`,
+                    height: `${nextHeight}px`,
                 },
                 transform,
             }, drag),

diff --git a/packages/react-moveable/src/react-moveable/ables/Scalable.ts b/packages/react-moveable/src/react-moveable/ables/Scalable.ts
@@ -141,6 +141,8 @@ export default {
         });
         const result = triggerEvent(moveable, "onScaleStart", params);
 
+        datas.startFixedDirection = datas.fixedDirection;
+
         if (result !== false) {
             datas.isScale = true;
             moveable.state.snapRenderInfo = {
@@ -233,6 +235,7 @@ export default {
 
                 return scale;
             },
+            startFixedDirection: datas.startFixedDirection,
             setScale(nextScale: number[]) {
                 scale = nextScale;
             },

diff --git a/packages/react-moveable/src/react-moveable/types.ts b/packages/react-moveable/src/react-moveable/types.ts
@@ -789,6 +789,10 @@ export interface OnBeforeScale extends OnEvent {
      * If fixedDirection is set, the scale values can be changed and can be reconfirmed as a return value.
      */
     setFixedDirection: (startDirecition: number[]) => number[];
+    /**
+     * fixedDirection set by rotateStart.
+     */
+    startFixedDirection: number[];
     /**
      * Set target's scale to scaling.
      */
@@ -900,6 +904,10 @@ export interface OnBeforeResize extends OnEvent {
      * If fixedDirection is set, the boundingWidth and boundingHeight values can be changed and can be reconfirmed as a return value.
      */
     setFixedDirection: (startDirecition: number[]) => number[];
+    /**
+     * fixedDirection set by resizeStart.
+     */
+    startFixedDirection: number[];
     /**
      * Set the bounding size to resizing.
      */