react-sync-board 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +24 -18
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +24 -18
- package/dist/esm/index.js.map +1 -1
- package/dist/react-sync-board.min.js +1 -1
- package/dist/react-sync-board.min.js.map +1 -1
- package/package.json +1 -1
package/dist/esm/index.js
CHANGED
|
@@ -6900,6 +6900,9 @@ var Board = function Board(_ref) {
|
|
|
6900
6900
|
var _useDim = useDim(),
|
|
6901
6901
|
updateItemExtent = _useDim.updateItemExtent;
|
|
6902
6902
|
|
|
6903
|
+
var _useRecoilValue = useRecoilValue(ConfigurationAtom),
|
|
6904
|
+
itemExtent = _useRecoilValue.itemExtent;
|
|
6905
|
+
|
|
6903
6906
|
var boardStyle = React.useMemo(function () {
|
|
6904
6907
|
return _objectSpread2({
|
|
6905
6908
|
userSelect: "none",
|
|
@@ -6918,6 +6921,7 @@ var Board = function Board(_ref) {
|
|
|
6918
6921
|
}, [itemTemplates, setConfiguration, boardSize]);
|
|
6919
6922
|
React.useEffect(function () {
|
|
6920
6923
|
updateItemExtent();
|
|
6924
|
+
setTimeout(updateItemExtent, 2000);
|
|
6921
6925
|
}, [updateItemExtent]);
|
|
6922
6926
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SubcribeItemEvents, null), /*#__PURE__*/React.createElement(PanZoom, {
|
|
6923
6927
|
moveFirst: moveFirst
|
|
@@ -6931,10 +6935,16 @@ var Board = function Board(_ref) {
|
|
|
6931
6935
|
className: "board"
|
|
6932
6936
|
}, /*#__PURE__*/React.createElement(ItemList, {
|
|
6933
6937
|
itemTemplates: itemTemplates
|
|
6934
|
-
}))
|
|
6938
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
6939
|
+
style: _objectSpread2(_objectSpread2({}, itemExtent), {}, {
|
|
6940
|
+
border: "3px solid red",
|
|
6941
|
+
position: "absolute"
|
|
6942
|
+
})
|
|
6943
|
+
}))))), /*#__PURE__*/React.createElement(Selection, null));
|
|
6935
6944
|
};
|
|
6936
6945
|
|
|
6937
6946
|
var TOLERANCE = 100;
|
|
6947
|
+
var MIN_SIZE = 1000;
|
|
6938
6948
|
|
|
6939
6949
|
var translateBoundaries = function translateBoundaries(_ref) {
|
|
6940
6950
|
var x = _ref.x,
|
|
@@ -7197,7 +7207,7 @@ var useDim = function useDim() {
|
|
|
7197
7207
|
var snapshot = _ref10.snapshot,
|
|
7198
7208
|
set = _ref10.set;
|
|
7199
7209
|
return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
|
|
7200
|
-
var itemIds, _yield$snapshot$getPr7, boardWrapperRect, boardWrapper, boardSize, _yield$snapshot$getPr8, scale, translateX, translateY, _ref12, left, top, width, height, relativeExtent;
|
|
7210
|
+
var itemIds, _yield$snapshot$getPr7, boardWrapperRect, boardWrapper, boardSize, _yield$snapshot$getPr8, scale, translateX, translateY, _ref12, left, top, width, height, relativeExtent, delta, _delta;
|
|
7201
7211
|
|
|
7202
7212
|
return regeneratorRuntime.wrap(function _callee5$(_context5) {
|
|
7203
7213
|
while (1) {
|
|
@@ -7237,33 +7247,29 @@ var useDim = function useDim() {
|
|
|
7237
7247
|
height: height / scale
|
|
7238
7248
|
};
|
|
7239
7249
|
relativeExtent.right = relativeExtent.left + relativeExtent.width;
|
|
7240
|
-
relativeExtent.bottom = relativeExtent.top + relativeExtent.height; //
|
|
7241
|
-
|
|
7242
|
-
if (relativeExtent.left > boardSize / 2 - 500) {
|
|
7243
|
-
relativeExtent.left = boardSize / 2 - 500;
|
|
7244
|
-
}
|
|
7245
|
-
|
|
7246
|
-
if (relativeExtent.top > boardSize / 2 - 500) {
|
|
7247
|
-
relativeExtent.top = boardSize / 2 - 500;
|
|
7248
|
-
}
|
|
7250
|
+
relativeExtent.bottom = relativeExtent.top + relativeExtent.height; // Resize to have a minimal size
|
|
7249
7251
|
|
|
7250
|
-
if (relativeExtent.
|
|
7251
|
-
|
|
7252
|
+
if (relativeExtent.width < MIN_SIZE) {
|
|
7253
|
+
delta = (MIN_SIZE - relativeExtent.width) / 2;
|
|
7254
|
+
relativeExtent.left -= delta;
|
|
7255
|
+
relativeExtent.right += delta;
|
|
7256
|
+
relativeExtent.width = MIN_SIZE;
|
|
7252
7257
|
}
|
|
7253
7258
|
|
|
7254
|
-
if (relativeExtent.
|
|
7255
|
-
|
|
7259
|
+
if (relativeExtent.height < MIN_SIZE) {
|
|
7260
|
+
_delta = (MIN_SIZE - relativeExtent.height) / 2;
|
|
7261
|
+
relativeExtent.top -= _delta;
|
|
7262
|
+
relativeExtent.bottom += _delta;
|
|
7263
|
+
relativeExtent.height = MIN_SIZE;
|
|
7256
7264
|
}
|
|
7257
7265
|
|
|
7258
|
-
relativeExtent.width = relativeExtent.right - relativeExtent.left;
|
|
7259
|
-
relativeExtent.height = relativeExtent.bottom - relativeExtent.top;
|
|
7260
7266
|
set(ConfigurationAtom, function (prev) {
|
|
7261
7267
|
return _objectSpread2(_objectSpread2({}, prev), {}, {
|
|
7262
7268
|
itemExtent: relativeExtent
|
|
7263
7269
|
});
|
|
7264
7270
|
});
|
|
7265
7271
|
|
|
7266
|
-
case
|
|
7272
|
+
case 22:
|
|
7267
7273
|
case "end":
|
|
7268
7274
|
return _context5.stop();
|
|
7269
7275
|
}
|