react-sync-board 0.4.0 → 0.4.1

package/dist/cjs/index.js

@@ -6908,6 +6908,9 @@ var Board = function Board(_ref) {
   var _useDim = useDim(),
       updateItemExtent = _useDim.updateItemExtent;
 
+  var _useRecoilValue = recoil.useRecoilValue(ConfigurationAtom),
+      itemExtent = _useRecoilValue.itemExtent;
+
   var boardStyle = React__default['default'].useMemo(function () {
     return _objectSpread2({
       userSelect: "none",
@@ -6926,6 +6929,7 @@ var Board = function Board(_ref) {
   }, [itemTemplates, setConfiguration, boardSize]);
   React__default['default'].useEffect(function () {
     updateItemExtent();
+    setTimeout(updateItemExtent, 2000);
   }, [updateItemExtent]);
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(SubcribeItemEvents, null), /*#__PURE__*/React__default['default'].createElement(PanZoom, {
     moveFirst: moveFirst
@@ -6939,10 +6943,16 @@ var Board = function Board(_ref) {
     className: "board"
   }, /*#__PURE__*/React__default['default'].createElement(ItemList, {
     itemTemplates: itemTemplates
-  })))))), /*#__PURE__*/React__default['default'].createElement(Selection, null));
+  })), /*#__PURE__*/React__default['default'].createElement("div", {
+    style: _objectSpread2(_objectSpread2({}, itemExtent), {}, {
+      border: "3px solid red",
+      position: "absolute"
+    })
+  }))))), /*#__PURE__*/React__default['default'].createElement(Selection, null));
 };
 
 var TOLERANCE = 100;
+var MIN_SIZE = 1000;
 
 var translateBoundaries = function translateBoundaries(_ref) {
   var x = _ref.x,
@@ -7205,7 +7215,7 @@ var useDim = function useDim() {
     var snapshot = _ref10.snapshot,
         set = _ref10.set;
     return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
-      var itemIds, _yield$snapshot$getPr7, boardWrapperRect, boardWrapper, boardSize, _yield$snapshot$getPr8, scale, translateX, translateY, _ref12, left, top, width, height, relativeExtent;
+      var itemIds, _yield$snapshot$getPr7, boardWrapperRect, boardWrapper, boardSize, _yield$snapshot$getPr8, scale, translateX, translateY, _ref12, left, top, width, height, relativeExtent, delta, _delta;
 
       return regeneratorRuntime.wrap(function _callee5$(_context5) {
         while (1) {
@@ -7245,33 +7255,29 @@ var useDim = function useDim() {
                 height: height / scale
               };
               relativeExtent.right = relativeExtent.left + relativeExtent.width;
-              relativeExtent.bottom = relativeExtent.top + relativeExtent.height; // Correct if not minimal
-
-              if (relativeExtent.left > boardSize / 2 - 500) {
-                relativeExtent.left = boardSize / 2 - 500;
-              }
-
-              if (relativeExtent.top > boardSize / 2 - 500) {
-                relativeExtent.top = boardSize / 2 - 500;
-              }
+              relativeExtent.bottom = relativeExtent.top + relativeExtent.height; // Resize to have a minimal size
 
-              if (relativeExtent.right < boardSize / 2 + 500) {
-                relativeExtent.right = boardSize / 2 + 500;
+              if (relativeExtent.width < MIN_SIZE) {
+                delta = (MIN_SIZE - relativeExtent.width) / 2;
+                relativeExtent.left -= delta;
+                relativeExtent.right += delta;
+                relativeExtent.width = MIN_SIZE;
               }
 
-              if (relativeExtent.bottom < boardSize / 2 + 500) {
-                relativeExtent.bottom = boardSize / 2 + 500;
+              if (relativeExtent.height < MIN_SIZE) {
+                _delta = (MIN_SIZE - relativeExtent.height) / 2;
+                relativeExtent.top -= _delta;
+                relativeExtent.bottom += _delta;
+                relativeExtent.height = MIN_SIZE;
               }
 
-              relativeExtent.width = relativeExtent.right - relativeExtent.left;
-              relativeExtent.height = relativeExtent.bottom - relativeExtent.top;
               set(ConfigurationAtom, function (prev) {
                 return _objectSpread2(_objectSpread2({}, prev), {}, {
                   itemExtent: relativeExtent
                 });
               });
 
-            case 26:
+            case 22:
             case "end":
               return _context5.stop();
           }