react-rnd - npm Package Compare versions

Comparing version 4.2.2 to 5.0.0-rc.1

lib/index.js

@@ -6,7 +6,28 @@ 'use strict';
 });
+exports.default = undefined;
 
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+var _extends2 = require('babel-runtime/helpers/extends');
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _extends3 = _interopRequireDefault(_extends2);
 
+var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
+
+var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
+
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
+var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
+
+var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
+
+var _inherits2 = require('babel-runtime/helpers/inherits');
+
+var _inherits3 = _interopRequireDefault(_inherits2);
+
 var _react = require('react');
@@ -16,5 +37,5 @@
 
-var _reactDraggableCustom = require('@bokuweb/react-draggable-custom');
+var _reactDraggable = require('react-draggable');
 
-var _reactDraggableCustom2 = _interopRequireDefault(_reactDraggableCustom);
+var _reactDraggable2 = _interopRequireDefault(_reactDraggable);
 
@@ -27,8 +48,2 @@ var _reactResizableBox = require('react-resizable-box');
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 var boxStyle = {
@@ -38,92 +53,127 @@ width: 'auto',
   cursor: 'move',
-  position: 'absolute'
+  display: 'inline-block'
 };
 
-var ReactRnd = function (_Component) {
-  _inherits(ReactRnd, _Component);
+var Rnd = function (_Component) {
+  (0, _inherits3.default)(Rnd, _Component);
 
-  function ReactRnd(props) {
-    _classCallCheck(this, ReactRnd);
+  function Rnd(props) {
+    (0, _classCallCheck3.default)(this, Rnd);
 
-    var _this = _possibleConstructorReturn(this, (ReactRnd.__proto__ || Object.getPrototypeOf(ReactRnd)).call(this, props));
+    var _this = (0, _possibleConstructorReturn3.default)(this, (Rnd.__proto__ || (0, _getPrototypeOf2.default)(Rnd)).call(this, props));
 
     _this.state = {
-      isDraggable: true,
-      isMounted: false,
-      x: props.initial.x,
-      y: props.initial.y,
-      original: { x: props.initial.x, y: props.initial.y },
-      zIndex: props.zIndex
+      disableDragging: false,
+      z: props.z,
+      original: {
+        x: props.default.x || 0,
+        y: props.default.y || 0
+      },
+      bounds: {
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0
+      }
     };
-    _this.isResizing = false;
+    _this.onResizeStart = _this.onResizeStart.bind(_this);
+    _this.onResize = _this.onResize.bind(_this);
+    _this.onResizeStop = _this.onResizeStop.bind(_this);
     _this.onDragStart = _this.onDragStart.bind(_this);
     _this.onDrag = _this.onDrag.bind(_this);
     _this.onDragStop = _this.onDragStop.bind(_this);
-    _this.onResizeStart = _this.onResizeStart.bind(_this);
-    _this.onResize = _this.onResize.bind(_this);
-    _this.onResizeStop = _this.onResizeStop.bind(_this);
     return _this;
   }
 
-  _createClass(ReactRnd, [{
-    key: 'onResizeStart',
-    value: function onResizeStart(dir, styleSize, clientSize, e) {
+  (0, _createClass3.default)(Rnd, [{
+    key: 'onDragStart',
+    value: function onDragStart(e, data) {
+      if (this.props.onDragStart) {
+        this.props.onDragStart(e, data);
+      }
+      var parent = this.wrapper && this.wrapper.parentNode;
+      var target = this.props.bounds === 'parent' ? parent : document.querySelector(this.props.bounds);
+      if (!this.props.bounds) return;
+      if (!(target instanceof HTMLElement) || !(parent instanceof HTMLElement)) return;
+      var targetRect = target.getBoundingClientRect();
+      var targetLeft = targetRect.left;
+      var targetTop = targetRect.top;
+      var parentRect = parent.getBoundingClientRect();
+      var parentLeft = parentRect.left;
+      var parentTop = parentRect.top;
+      var left = targetLeft - parentLeft;
+      var top = targetTop - parentTop;
       this.setState({
-        isDraggable: false,
-        original: { x: this.state.x, y: this.state.y }
+        bounds: {
+          top: top,
+          right: left + (target.offsetWidth - this.resizable.size.width),
+          bottom: top + (target.offsetHeight - this.resizable.size.height),
+          left: left
+        }
       });
-      this.isResizing = true;
-      this.props.onResizeStart(dir, styleSize, clientSize, e);
-      e.stopPropagation();
     }
   }, {
-    key: 'onResize',
-    value: function onResize(dir, styleSize, clientSize, delta) {
-      if (/left/i.test(dir)) {
-        this.setState({ x: this.state.original.x - delta.width });
+    key: 'getResizableBounds',
+    value: function getResizableBounds() {
+      if (this.props.bounds === 'parent') {
+        if (!this.wrapper) return undefined;
+        if (!(this.wrapper.parentNode instanceof HTMLElement)) return undefined;
+        return this.wrapper.parentNode;
       }
-      if (/top/i.test(dir)) {
-        this.setState({ y: this.state.original.y - delta.height });
-      }
-      this.props.onResize(dir, styleSize, clientSize, delta, {
-        x: this.state.x,
-        y: this.state.y
-      });
+      return document.querySelector(this.props.bounds);
     }
   }, {
-    key: 'onResizeStop',
-    value: function onResizeStop(dir, styleSize, clientSize, delta) {
-      this.setState({ isDraggable: true });
-      this.isResizing = false;
-      this.props.onResizeStop(dir, styleSize, clientSize, delta, {
-        x: this.state.x,
-        y: this.state.y
-      });
+    key: 'onDrag',
+    value: function onDrag(e, data) {
+      if (this.props.onDrag) {
+        this.props.onDrag(e, data);
+      }
     }
   }, {
-    key: 'onDragStart',
-    value: function onDragStart(e, ui) {
-      if (this.isResizing) return;
-      this.props.onDragStart(e, ui);
+    key: 'onDragStop',
+    value: function onDragStop(e, data) {
+      if (this.props.onDragStop) {
+        this.props.onDragStop(e, data);
+      }
     }
   }, {
-    key: 'onDrag',
-    value: function onDrag(e, ui) {
-      if (this.isResizing) return;
-      var allowX = this.props.moveAxis === 'x';
-      var allowY = this.props.moveAxis === 'y';
-      var allowBoth = this.props.moveAxis === 'both';
+    key: 'onResizeStart',
+    value: function onResizeStart(e, dir, refToResizableElement) {
       this.setState({
-        x: allowX || allowBoth ? ui.position.left : this.state.x,
-        y: allowY || allowBoth ? ui.position.top : this.state.y
+        disableDragging: true,
+        original: { x: this.draggable.state.x, y: this.draggable.state.y }
       });
-      this.props.onDrag(e, ui);
+      if (this.props.onResizeStart) {
+        this.props.onResizeStart(e, dir, refToResizableElement);
+      }
+      e.stopPropagation();
     }
   }, {
-    key: 'onDragStop',
-    value: function onDragStop(e, ui) {
-      if (this.isResizing) return;
-      this.props.onDragStop(e, ui);
+    key: 'onResize',
+    value: function onResize(e, direction, refToResizableElement, delta) {
+      if (/left/i.test(direction)) {
+        this.draggable.setState({ x: this.state.original.x - delta.width });
+      }
+      if (/top/i.test(direction)) {
+        this.draggable.setState({ y: this.state.original.y - delta.height });
+      }
+      if (this.props.onResize) {
+        this.props.onResize(event, direction, refToResizableElement, delta, {
+          x: this.draggable.state.x,
+          y: this.draggable.state.y
+        });
+      }
     }
   }, {
+    key: 'onResizeStop',
+    value: function onResizeStop(e, direction, refToResizableElement, delta) {
+      this.setState({ disableDragging: false });
+      if (this.props.onResizeStop) {
+        this.props.onResizeStop(event, direction, refToResizableElement, delta, {
+          x: this.draggable.state.x,
+          y: this.draggable.state.y
+        });
+      }
+    }
+  }, {
     key: 'updateSize',
@@ -135,12 +185,9 @@ value: function updateSize(size) {
     key: 'updatePosition',
-    value: function updatePosition(_ref) {
-      var x = _ref.x;
-      var y = _ref.y;
-
-      this.setState({ x: x, y: y });
+    value: function updatePosition(position) {
+      this.draggable.setState(position);
     }
   }, {
     key: 'updateZIndex',
-    value: function updateZIndex(zIndex) {
-      this.setState({ zIndex: zIndex });
+    value: function updateZIndex(z) {
+      this.setState({ z: z });
     }
@@ -152,44 +199,27 @@ }, {
 
-      var _props = this.props;
-      var className = _props.className;
-      var style = _props.style;
-      var onClick = _props.onClick;
-      var onTouchStart = _props.onTouchStart;
-      var initial = _props.initial;
-      var minWidth = _props.minWidth;
-      var minHeight = _props.minHeight;
-      var maxWidth = _props.maxWidth;
-      var maxHeight = _props.maxHeight;
-      var bounds = _props.bounds;
-      var moveAxis = _props.moveAxis;
-      var dragHandlerClassName = _props.dragHandlerClassName;
-      var lockAspectRatio = _props.lockAspectRatio;
-      var moveGrid = _props.moveGrid;
-      var resizeGrid = _props.resizeGrid;
-      var onDoubleClick = _props.onDoubleClick;
-      var _state = this.state;
-      var x = _state.x;
-      var y = _state.y;
-      var zIndex = _state.zIndex;
-
       return _react2.default.createElement(
-        _reactDraggableCustom2.default,
+        _reactDraggable2.default,
         {
-          axis: moveAxis,
-          zIndex: zIndex,
-          start: { x: initial.x, y: initial.y },
-          disabled: !this.state.isDraggable || this.props.moveAxis === 'none',
+          ref: function ref(c) {
+            _this2.draggable = c;
+          },
+          handle: this.props.dragHandlerClassName,
+          defaultPosition: { x: this.props.default.x, y: this.props.default.y },
           onStart: this.onDragStart,
-          handle: dragHandlerClassName,
           onDrag: this.onDrag,
           onStop: this.onDragStop,
-          bounds: bounds,
-          grid: moveGrid,
-          passCoordinate: true,
-          x: x,
-          y: y
+          axis: this.props.dragAxis,
+          zIndex: this.state.z,
+          grid: this.props.dragGrid,
+          bounds: this.props.bounds ? this.state.bounds : undefined
         },
         _react2.default.createElement(
           'div',
-          { style: _extends(boxStyle, { zIndex: zIndex }) },
+          {
+            className: this.props.className,
+            style: (0, _extends3.default)({}, boxStyle, this.props.style),
+            ref: function ref(c) {
+              _this2.wrapper = c;
+            }
+          },
           _react2.default.createElement(
@@ -201,20 +231,17 @@ _reactResizableBox2.default,
               },
-              onClick: onClick,
-              onDoubleClick: onDoubleClick,
-              onTouchStart: onTouchStart,
+              enable: this.props.enableResizing,
               onResizeStart: this.onResizeStart,
               onResize: this.onResize,
               onResizeStop: this.onResizeStop,
-              width: initial.width,
-              height: initial.height,
-              minWidth: minWidth,
-              minHeight: minHeight,
-              maxWidth: maxWidth,
-              maxHeight: maxHeight,
-              customStyle: _extends(style, { boxSizing: 'border-box' }),
-              customClass: className,
-              isResizable: this.props.isResizable,
-              handleStyle: this.props.resizerHandleStyle,
-              grid: resizeGrid,
-              lockAspectRatio: lockAspectRatio
+              width: this.props.default.width,
+              height: this.props.default.height,
+              minWidth: this.props.minWidth,
+              minHeight: this.props.minHeight,
+              maxWidth: this.props.maxWidth,
+              maxHeight: this.props.maxHeight,
+              grid: this.props.resizeGrid,
+              bounds: this.getResizableBounds(),
+              lockAspectRatio: this.props.lockAspectRatio,
+              handlerStyles: this.props.resizeHandlerStyles,
+              handlerClasses: this.props.resizeHandlerClasses
             },
@@ -227,92 +254,5 @@ this.props.children
   }]);
-
-  return ReactRnd;
+  return Rnd;
 }(_react.Component);
 
-ReactRnd.propTypes = {
-  onResizeStart: _react.PropTypes.func,
-  onResize: _react.PropTypes.func,
-  onResizeStop: _react.PropTypes.func,
-  onDragStart: _react.PropTypes.func,
-  onDrag: _react.PropTypes.func,
-  onDragStop: _react.PropTypes.func,
-  className: _react.PropTypes.string,
-  style: _react.PropTypes.object,
-  children: _react.PropTypes.any,
-  onTouchStart: _react.PropTypes.func,
-  onClick: _react.PropTypes.func,
-  onDoubleClick: _react.PropTypes.func,
-  dragHandlerClassName: _react.PropTypes.string,
-  resizerHandleStyle: _react.PropTypes.shape({
-    top: _react.PropTypes.object,
-    right: _react.PropTypes.object,
-    bottom: _react.PropTypes.object,
-    left: _react.PropTypes.object,
-    topRight: _react.PropTypes.object,
-    bottomRight: _react.PropTypes.object,
-    bottomLeft: _react.PropTypes.object,
-    topLeft: _react.PropTypes.object
-  }),
-  isResizable: _react.PropTypes.shape({
-    top: _react.PropTypes.bool,
-    right: _react.PropTypes.bool,
-    bottom: _react.PropTypes.bool,
-    left: _react.PropTypes.bool,
-    topRight: _react.PropTypes.bool,
-    bottomRight: _react.PropTypes.bool,
-    bottomLeft: _react.PropTypes.bool,
-    topLeft: _react.PropTypes.bool
-  }),
-  initial: _react.PropTypes.shape({
-    width: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]),
-    height: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.string]),
-    x: _react.PropTypes.number,
-    y: _react.PropTypes.number
-  }),
-  minWidth: _react.PropTypes.number,
-  minHeight: _react.PropTypes.number,
-  maxWidth: _react.PropTypes.number,
-  maxHeight: _react.PropTypes.number,
-  moveAxis: _react.PropTypes.oneOf(['x', 'y', 'both', 'none']),
-  moveGrid: _react.PropTypes.arrayOf(_react.PropTypes.number),
-  resizeGrid: _react.PropTypes.arrayOf(_react.PropTypes.number),
-  bounds: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.object]),
-  zIndex: _react.PropTypes.number,
-  lockAspectRatio: _react.PropTypes.bool
-};
-ReactRnd.defaultProps = {
-  initial: {
-    x: 0,
-    y: 0,
-    width: 100,
-    height: 100
-  },
-  zIndex: 100,
-  className: '',
-  dragHandlerClassName: '',
-  isResizable: {
-    top: true,
-    right: true,
-    bottom: true,
-    left: true,
-    topRight: true,
-    bottomRight: true,
-    bottomLeft: true,
-    topLeft: true
-  },
-  style: {},
-  moveAxis: 'both',
-  moveGrid: [1, 1],
-  onClick: function onClick() {},
-  onTouchStart: function onTouchStart() {},
-  onDragStart: function onDragStart() {},
-  onDrag: function onDrag() {},
-  onDragStop: function onDragStop() {},
-  onResizeStart: function onResizeStart() {},
-  onResize: function onResize() {},
-  onResizeStop: function onResizeStop() {},
-  resizeGrid: [1, 1],
-  lockAspectRatio: false
-};
-exports.default = ReactRnd;
-module.exports = exports['default'];
+exports.default = Rnd;

package.json

 {
   "name": "react-rnd",
-  "version": "4.2.2",
-  "description": "Resizable and draggable component for React.",
-  "main": "lib/index.js",
+  "license": "MIT",
+  "version": "5.0.0-rc.1",
   "scripts": {
-    "watch": "watchify --extension=js -o docs/dist/bundle.js docs/src/index.js",
-    "test": "karma start",
-    "compile": "babel -d lib/ src/",
-    "prepublish": "npm run compile",
-    "lint": "eslint react",
-    "prepush": "npm run lint && npm t"
+    "start": "webpack-dev-server",
+    "build": "NODE_ENV=production babel -d lib/ src/components/ --copy-files",
+    "flow": "flow",
+    "lint": "eslint src",
+    "test": "NODE_ENV=test ava",
+    "guide:server": "styleguidist server",
+    "guide:build": "styleguidist build",
+    "prepublish": "npm run build"
   },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/bokuweb/react-resazable-and-movable.git"
-  },
   "keywords": [
@@ -22,62 +19,57 @@ "react",
     "resizable",
-    "movable",
-    "draggable",
-    "window",
-    "component"
+    "component",
+    "draggable"
   ],
-  "author": "bokuweb",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/bokuweb/react-resazable-and-movable/issues"
-  },
-  "homepage": "https://github.com/bokuweb/react-resazable-and-movable/",
-  "peerDependencies": {
-    "react": ">=0.14.0",
-    "react-dom": ">=0.14.0"
-  },
   "devDependencies": {
-    "babel": "^6.5.2",
-    "babel-cli": "^6.7.5",
-    "babel-plugin-add-module-exports": "^0.1.2",
-    "babel-plugin-espower": "^2.1.2",
-    "babel-plugin-transform-object-assign": "^6.8.0",
-    "babel-polyfill": "^6.7.4",
-    "babel-preset-es2015": "^6.3.13",
-    "babel-preset-react": "^6.1.18",
-    "babel-preset-stage-0": "^6.5.0",
-    "babelify": "^7.2.0",
-    "browserify": "^13.0.0",
-    "eslint": "^2.7.0",
-    "eslint-config-airbnb": "^6.2.0",
-    "eslint-plugin-react": "^4.3.0",
-    "espower-babel": "^4.0.3",
-    "estraverse": "^4.2.0",
-    "estraverse-fb": "^1.3.1",
-    "husky": "^0.11.4",
-    "karma": "^0.13.22",
-    "karma-browserify": "^5.0.3",
-    "karma-cli": "^0.1.2",
-    "karma-mocha": "^0.2.2",
-    "karma-phantomjs-launcher": "^1.0.0",
-    "mocha": "^2.4.5",
-    "phantomjs-prebuilt": "^2.1.7",
-    "power-assert": "^1.3.1",
-    "react": "^15.0.1",
-    "react-addons-test-utils": "^15.0.1",
-    "react-dom": "^15.3.2",
-    "sinon": "^1.17.3",
-    "watchify": "^3.7.0"
+    "ava": "^0.19.1",
+    "babel-cli": "^6.24.1",
+    "babel-core": "^6.24.1",
+    "babel-eslint": "^7.2.2",
+    "babel-loader": "^6.4.1",
+    "babel-plugin-dynamic-import-webpack": "^1.0.1",
+    "babel-plugin-flow-runtime": "^0.10.0",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
+    "babel-plugin-transform-runtime": "^6.23.0",
+    "babel-polyfill": "^6.23.0",
+    "babel-preset-env": "^1.4.0",
+    "babel-preset-flow": "^6.23.0",
+    "babel-preset-react": "^6.24.1",
+    "browser-env": "^2.0.30",
+    "enzyme": "^2.8.2",
+    "eslint": "^3.19.0",
+    "eslint-config-airbnb": "^14.1.0",
+    "eslint-plugin-flowtype": "^2.30.4",
+    "eslint-plugin-import": "^2.2.0",
+    "eslint-plugin-jsx-a11y": "^4.0.0",
+    "eslint-plugin-react": "^6.10.3",
+    "flow-bin": "^0.44.0",
+    "flow-runtime": "^0.10.0",
+    "http-server": "^0.9.0",
+    "react": "^15.5.4",
+    "react-addons-test-utils": "^15.5.1",
+    "react-dom": "^15.5.4",
+    "react-hot-loader": "next",
+    "react-styleguidist": "^4.6.3",
+    "sinon": "^2.1.0",
+    "webpack": "2.3.1",
+    "webpack-async-await": "^1.1.0",
+    "webpack-dev-server": "^2.4.2"
   },
-  "browserify": {
-    "transform": [
-      "babelify"
+  "ava": {
+    "babel": "inherit",
+    "files": "src/**/*.test.js",
+    "require": [
+      "babel-register",
+      "./setup-browser-env.js"
     ]
   },
+  "dependencies": {
+    "react-draggable": "^2.2.3",
+    "react-resizable-box": "^2.0.2"
+  },
   "files": [
     "lib"
-  ],
-  "dependencies": {
-    "@bokuweb/react-draggable-custom": "^1.3.10",
-    "react-resizable-box": "^1.8.1"
-  }
+  ]
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No contributors or author data

Maintenance

Package does not specify a list of contributors or an author in package.json.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No README

Quality

Package does not have a README. This may indicate a failed publish or a low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26039

increased by99.33%

Dependency count

2

decreased by-50%

Number of package files

4

increased by33.33%

Lines of code

368

increased by28.22%

Number of medium quality alerts

0

decreased by-100%

Number of lines in readme file

474

increased byInfinity%

Worsened metrics

Dev dependency count

35

increased by12.9%

Number of low maintenance alerts

2

increased byInfinity%

Number of low quality alerts

2

increased byInfinity%

Number of low supply chain risk alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedreact-draggable@^2.2.3

• + Addedreact-draggable@2.2.6(transitive)

• + Addedreact-resizable-box@2.1.0(transitive)

• - Removed@bokuweb/react-draggable-custom@^1.3.10

• - Removed@bokuweb/react-draggable-custom@1.4.2(transitive)

• - Removedjs-tokens@4.0.0(transitive)

• - Removedlodash.isequal@4.5.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedreact@18.3.1(transitive)

• - Removedreact-dom@18.3.1(transitive)

• - Removedreact-resizable-box@1.8.4(transitive)

• - Removedscheduler@0.23.2(transitive)

• Updatedreact-resizable-box@^2.0.2