react-rnd - npm Package Compare versions

Comparing version 10.1.3 to 10.1.4

lib/index.d.ts

@@ -149,2 +149,6 @@ import * as React from "react";
     };
+    offsetFromParent: {
+        left: number;
+        top: number;
+    };
     constructor(props: Props);
@@ -182,6 +186,6 @@ componentDidMount(): void;
     updatePosition(position: Position): void;
-    getOffsetFromParent(): {
+    updateOffsetFromParent(): {
         top: number;
         left: number;
-    };
+    } | undefined;
     refDraggable: (c: any) => void;
@@ -188,0 +192,0 @@ refResizable: (c: Resizable | null) => void;

lib/index.es5.js

@@ -75,2 +75,3 @@ 'use strict';
         _this.resizingPosition = { x: 0, y: 0 };
+        _this.offsetFromParent = { left: 0, top: 0 };
         _this.refDraggable = function (c) {
@@ -110,3 +111,4 @@ if (!c)
     Rnd.prototype.componentDidMount = function () {
-        var _a = this.getOffsetFromParent(), left = _a.left, top = _a.top;
+        this.updateOffsetFromParent();
+        var _a = this.offsetFromParent, left = _a.left, top = _a.top;
         var _b = this.getDraggablePosition(), x = _b.x, y = _b.y;
@@ -212,3 +214,4 @@ this.draggable.setState({
             return;
-        var offset = this.getOffsetFromParent();
+        this.updateOffsetFromParent();
+        var offset = this.offsetFromParent;
         this.setState({
@@ -225,3 +228,3 @@ bounds: {
         if (this.props.onDrag) {
-            var offset = this.getOffsetFromParent();
+            var offset = this.offsetFromParent;
             this.props.onDrag(e, __assign(__assign({}, data), { x: data.x - offset.left, y: data.y - offset.top }));
@@ -232,3 +235,3 @@ }
         if (this.props.onDragStop) {
-            var _a = this.getOffsetFromParent(), left = _a.left, top_3 = _a.top;
+            var _a = this.offsetFromParent, left = _a.left, top_3 = _a.top;
             return this.props.onDragStop(e, __assign(__assign({}, data), { x: data.x + left, y: data.y + top_3 }));
@@ -241,3 +244,3 @@ }
         var scale = this.props.scale;
-        var offset = this.getOffsetFromParent();
+        var offset = this.offsetFromParent;
         var pos = this.getDraggablePosition();
@@ -334,23 +337,16 @@ this.resizingPosition = { x: pos.x + offset.left, y: pos.y + offset.top };
     Rnd.prototype.onResize = function (e, direction, elementRef, delta) {
-        var x;
-        var y;
-        var offset = this.getOffsetFromParent();
         if (/left/i.test(direction)) {
-            x = this.state.original.x - delta.width;
+            var x_1 = this.state.original.x - delta.width;
             // INFO: Apply x position by resize to draggable.
-            this.draggable.setState({ x: x });
-            x += offset.left;
+            this.draggable.setState({ x: x_1 });
         }
         if (/top/i.test(direction)) {
-            y = this.state.original.y - delta.height;
+            var y_1 = this.state.original.y - delta.height;
             // INFO: Apply x position by resize to draggable.
-            this.draggable.setState({ y: y });
-            y += offset.top;
+            this.draggable.setState({ y: y_1 });
         }
-        if (typeof x === "undefined") {
-            x = this.getDraggablePosition().x + offset.left;
-        }
-        if (typeof y === "undefined") {
-            y = this.getDraggablePosition().y + offset.top;
-        }
+        this.updateOffsetFromParent();
+        var offset = this.offsetFromParent;
+        var x = this.getDraggablePosition().x + offset.left;
+        var y = this.getDraggablePosition().y + offset.top;
         this.resizingPosition = { x: x, y: y };
@@ -380,3 +376,3 @@ if (!this.props.onResize)
     };
-    Rnd.prototype.getOffsetFromParent = function () {
+    Rnd.prototype.updateOffsetFromParent = function () {
         var scale = this.props.scale;
@@ -396,3 +392,3 @@ var parent = this.getParent();
         var position = this.getDraggablePosition();
-        return {
+        this.offsetFromParent = {
             left: selfRect.left - parentLeft - position.x * scale,
@@ -409,3 +405,3 @@ top: selfRect.top - parentTop - position.y * scale,
         var innerStyle = __assign(__assign(__assign({}, resizableStyle), cursorStyle), style);
-        var _b = this.getOffsetFromParent(), left = _b.left, top = _b.top;
+        var _b = this.offsetFromParent, left = _b.left, top = _b.top;
         var draggablePosition;
@@ -412,0 +408,0 @@ if (position) {

lib/index.js

@@ -71,2 +71,3 @@ import { createElement, PureComponent } from 'react';
         _this.resizingPosition = { x: 0, y: 0 };
+        _this.offsetFromParent = { left: 0, top: 0 };
         _this.refDraggable = function (c) {
@@ -106,3 +107,4 @@ if (!c)
     Rnd.prototype.componentDidMount = function () {
-        var _a = this.getOffsetFromParent(), left = _a.left, top = _a.top;
+        this.updateOffsetFromParent();
+        var _a = this.offsetFromParent, left = _a.left, top = _a.top;
         var _b = this.getDraggablePosition(), x = _b.x, y = _b.y;
@@ -208,3 +210,4 @@ this.draggable.setState({
             return;
-        var offset = this.getOffsetFromParent();
+        this.updateOffsetFromParent();
+        var offset = this.offsetFromParent;
         this.setState({
@@ -221,3 +224,3 @@ bounds: {
         if (this.props.onDrag) {
-            var offset = this.getOffsetFromParent();
+            var offset = this.offsetFromParent;
             this.props.onDrag(e, __assign(__assign({}, data), { x: data.x - offset.left, y: data.y - offset.top }));
@@ -228,3 +231,3 @@ }
         if (this.props.onDragStop) {
-            var _a = this.getOffsetFromParent(), left = _a.left, top_3 = _a.top;
+            var _a = this.offsetFromParent, left = _a.left, top_3 = _a.top;
             return this.props.onDragStop(e, __assign(__assign({}, data), { x: data.x + left, y: data.y + top_3 }));
@@ -237,3 +240,3 @@ }
         var scale = this.props.scale;
-        var offset = this.getOffsetFromParent();
+        var offset = this.offsetFromParent;
         var pos = this.getDraggablePosition();
@@ -330,23 +333,16 @@ this.resizingPosition = { x: pos.x + offset.left, y: pos.y + offset.top };
     Rnd.prototype.onResize = function (e, direction, elementRef, delta) {
-        var x;
-        var y;
-        var offset = this.getOffsetFromParent();
         if (/left/i.test(direction)) {
-            x = this.state.original.x - delta.width;
+            var x_1 = this.state.original.x - delta.width;
             // INFO: Apply x position by resize to draggable.
-            this.draggable.setState({ x: x });
-            x += offset.left;
+            this.draggable.setState({ x: x_1 });
         }
         if (/top/i.test(direction)) {
-            y = this.state.original.y - delta.height;
+            var y_1 = this.state.original.y - delta.height;
             // INFO: Apply x position by resize to draggable.
-            this.draggable.setState({ y: y });
-            y += offset.top;
+            this.draggable.setState({ y: y_1 });
         }
-        if (typeof x === "undefined") {
-            x = this.getDraggablePosition().x + offset.left;
-        }
-        if (typeof y === "undefined") {
-            y = this.getDraggablePosition().y + offset.top;
-        }
+        this.updateOffsetFromParent();
+        var offset = this.offsetFromParent;
+        var x = this.getDraggablePosition().x + offset.left;
+        var y = this.getDraggablePosition().y + offset.top;
         this.resizingPosition = { x: x, y: y };
@@ -376,3 +372,3 @@ if (!this.props.onResize)
     };
-    Rnd.prototype.getOffsetFromParent = function () {
+    Rnd.prototype.updateOffsetFromParent = function () {
         var scale = this.props.scale;
@@ -392,3 +388,3 @@ var parent = this.getParent();
         var position = this.getDraggablePosition();
-        return {
+        this.offsetFromParent = {
             left: selfRect.left - parentLeft - position.x * scale,
@@ -405,3 +401,3 @@ top: selfRect.top - parentTop - position.y * scale,
         var innerStyle = __assign(__assign(__assign({}, resizableStyle), cursorStyle), style);
-        var _b = this.getOffsetFromParent(), left = _b.left, top = _b.top;
+        var _b = this.offsetFromParent, left = _b.left, top = _b.top;
         var draggablePosition;
@@ -408,0 +404,0 @@ if (position) {

package.json

 {
   "name": "react-rnd",
-  "version": "10.1.3",
+  "version": "10.1.4",
   "description": "",
@@ -43,16 +43,16 @@ "title": "react-rnd",
   "devDependencies": {
-    "@babel/cli": "7.7.5",
-    "@babel/core": "7.7.5",
-    "@babel/plugin-proposal-class-properties": "7.7.4",
-    "@babel/plugin-transform-modules-commonjs": "7.7.5",
-    "@babel/preset-react": "7.7.4",
-    "@babel/preset-typescript": "7.7.4",
-    "@babel/traverse": "7.7.4",
-    "@babel/types": "7.7.4",
-    "@emotion/core": "10.0.14",
-    "@storybook/addon-actions": "5.1.3",
-    "@storybook/addon-info": "5.1.3",
-    "@storybook/addon-links": "5.1.3",
-    "@storybook/addon-options": "5.1.3",
-    "@storybook/react": "5.1.3",
+    "@babel/cli": "7.8.0",
+    "@babel/core": "7.8.0",
+    "@babel/plugin-proposal-class-properties": "7.8.0",
+    "@babel/plugin-transform-modules-commonjs": "7.8.0",
+    "@babel/preset-react": "7.8.0",
+    "@babel/preset-typescript": "7.8.0",
+    "@babel/traverse": "7.8.0",
+    "@babel/types": "7.8.0",
+    "@emotion/core": "10.0.27",
+    "@storybook/addon-actions": "5.3.1",
+    "@storybook/addon-info": "5.3.1",
+    "@storybook/addon-links": "5.3.1",
+    "@storybook/addon-options": "5.3.1",
+    "@storybook/react": "5.3.1",
     "@types/enzyme": "3.1.16",
@@ -71,3 +71,3 @@ "@types/enzyme-adapter-react-16": "1.0.5",
     "cpy-cli": "2.0.0",
-    "cross-env": "5.2.0",
+    "cross-env": "6.0.3",
     "enzyme": "3.8.0",
@@ -78,3 +78,3 @@ "enzyme-adapter-react-16": "1.9.1",
     "npm-run-all": "4.1.5",
-    "prettier": "1.18.2",
+    "prettier": "1.19.1",
     "react": "16.8.6",
@@ -92,7 +92,7 @@ "react-dom": "16.8.6",
     "sinon": "7.3.2",
-    "tslint": "5.18.0",
+    "tslint": "5.20.1",
     "tslint-eslint-rules": "5.4.0",
-    "tslint-plugin-prettier": "2.0.1",
-    "tslint-react": "4.0.0",
-    "typescript": "3.7.3"
+    "tslint-plugin-prettier": "2.1.0",
+    "tslint-react": "4.1.0",
+    "typescript": "3.7.4"
   },
@@ -99,0 +99,0 @@ "files": [

README.md

@@ -511,2 +511,6 @@ <p align="center"><img src ="https://github.com/bokuweb/react-rnd/blob/master/logo.png?raw=true" /></p>
 
+#### v10.1.3
+
+- Fixed a bug, position is wrong when onResize #618
+
 #### v10.1.2
@@ -513,0 +517,0 @@

No alert changes

Improved metrics

Total package byte prevSize

122816

increased by46.15%

Number of package files

10

increased by11.11%

Lines of code

1873

increased by80.79%

Number of lines in readme file

814

increased by0.49%

No dependency changes