react-sync-board 0.5.2 → 0.5.5
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 +40 -30
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +40 -30
- 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 +3 -3
package/dist/cjs/index.js
CHANGED
|
@@ -4325,7 +4325,7 @@ var _excluded$2 = ["type", "rotation", "id", "locked", "layer"],
|
|
|
4325
4325
|
_excluded3 = ["x", "y", "layer", "moving"];
|
|
4326
4326
|
|
|
4327
4327
|
var _templateObject$2;
|
|
4328
|
-
var ItemWrapper = newStyled.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n display: inline-block;\n transition: transform 150ms;\n user-select: none;\n padding:
|
|
4328
|
+
var ItemWrapper = newStyled.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n display: inline-block;\n transition: transform 150ms;\n user-select: none;\n padding: 2px;\n transform: rotate(", "deg);\n\n & .corner {\n position: absolute;\n width: 0px;\n height: 0px;\n }\n\n & .top-left {\n top: 0;\n left: 0;\n }\n & .top-right {\n top: 0;\n right: 0;\n }\n & .bottom-left {\n bottom: 0;\n left: 0;\n }\n & .bottom-right {\n bottom: 0;\n right: 0;\n }\n\n &.selected {\n border: 2px dashed #db5034;\n padding: 0px;\n cursor: pointer;\n }\n\n &.locked::after {\n content: \"\";\n position: absolute;\n width: 24px;\n height: 30px;\n top: 4px;\n right: 4px;\n opacity: 0.1;\n background-image: url(\"", "\");\n background-size: cover;\n user-select: none;\n }\n\n &.locked:hover::after {\n opacity: 0.3;\n }\n"])), function (_ref) {
|
|
4329
4329
|
var rotation = _ref.rotation;
|
|
4330
4330
|
return rotation;
|
|
4331
4331
|
}, img);
|
|
@@ -6974,8 +6974,8 @@ var BoundingBox = function BoundingBox() {
|
|
|
6974
6974
|
return /*#__PURE__*/React__default['default'].createElement("div", {
|
|
6975
6975
|
style: _objectSpread2(_objectSpread2({}, defaultZoneStyle), {}, {
|
|
6976
6976
|
transform: "translate(".concat(boundingBoxLast.left, "px, ").concat(boundingBoxLast.top, "px)"),
|
|
6977
|
-
height: "".concat(boundingBoxLast.height, "px"),
|
|
6978
|
-
width: "".concat(boundingBoxLast.width, "px")
|
|
6977
|
+
height: "".concat(boundingBoxLast.height - 2, "px"),
|
|
6978
|
+
width: "".concat(boundingBoxLast.width - 2, "px")
|
|
6979
6979
|
}),
|
|
6980
6980
|
className: "selection"
|
|
6981
6981
|
});
|
|
@@ -7639,8 +7639,14 @@ var useItemActions = function useItemActions() {
|
|
|
7639
7639
|
|
|
7640
7640
|
var _ref7 = item.grid || {},
|
|
7641
7641
|
itemType = _ref7.type,
|
|
7642
|
-
itemSize = _ref7.size
|
|
7643
|
-
|
|
7642
|
+
itemSize = _ref7.size,
|
|
7643
|
+
_ref7$offset = _ref7.offset;
|
|
7644
|
+
|
|
7645
|
+
_ref7$offset = _ref7$offset === void 0 ? {} : _ref7$offset;
|
|
7646
|
+
var _ref7$offset$x = _ref7$offset.x,
|
|
7647
|
+
offsetX = _ref7$offset$x === void 0 ? 0 : _ref7$offset$x,
|
|
7648
|
+
_ref7$offset$y = _ref7$offset.y,
|
|
7649
|
+
offsetY = _ref7$offset$y === void 0 ? 0 : _ref7$offset$y;
|
|
7644
7650
|
var type = globalType;
|
|
7645
7651
|
var size = globalSize || 1; // If item specific
|
|
7646
7652
|
|
|
@@ -7649,8 +7655,8 @@ var useItemActions = function useItemActions() {
|
|
|
7649
7655
|
size = itemSize || 1;
|
|
7650
7656
|
}
|
|
7651
7657
|
|
|
7652
|
-
var centerX = item.x + elem.clientWidth / 2,
|
|
7653
|
-
centerY = item.y + elem.clientHeight / 2;
|
|
7658
|
+
var centerX = item.x + elem.clientWidth / 2 - offsetX,
|
|
7659
|
+
centerY = item.y + elem.clientHeight / 2 - offsetY;
|
|
7654
7660
|
var newX;
|
|
7655
7661
|
var newY;
|
|
7656
7662
|
var sizeX;
|
|
@@ -7715,8 +7721,8 @@ var useItemActions = function useItemActions() {
|
|
|
7715
7721
|
}
|
|
7716
7722
|
|
|
7717
7723
|
result[id] = _objectSpread2(_objectSpread2({}, item), {}, {
|
|
7718
|
-
x: newX - elem.clientWidth / 2,
|
|
7719
|
-
y: newY - elem.clientHeight / 2
|
|
7724
|
+
x: newX + offsetX - elem.clientWidth / 2,
|
|
7725
|
+
y: newY + offsetY - elem.clientHeight / 2
|
|
7720
7726
|
});
|
|
7721
7727
|
updatedItems[id] = result[id];
|
|
7722
7728
|
});
|
|
@@ -8052,7 +8058,6 @@ var useItemActions = function useItemActions() {
|
|
|
8052
8058
|
_ref19$passLocked,
|
|
8053
8059
|
passLocked,
|
|
8054
8060
|
foundElement,
|
|
8055
|
-
isPassthrough,
|
|
8056
8061
|
itemList,
|
|
8057
8062
|
_yield$snapshot$getPr2,
|
|
8058
8063
|
boardWrapper,
|
|
@@ -8079,35 +8084,40 @@ var useItemActions = function useItemActions() {
|
|
|
8079
8084
|
foundElement = insideClass(target, "item");
|
|
8080
8085
|
|
|
8081
8086
|
if (!foundElement) {
|
|
8082
|
-
_context8.next =
|
|
8087
|
+
_context8.next = 28;
|
|
8083
8088
|
break;
|
|
8084
8089
|
}
|
|
8085
8090
|
|
|
8086
|
-
if (!
|
|
8091
|
+
if (!hasClass(foundElement, "selected")) {
|
|
8087
8092
|
_context8.next = 8;
|
|
8088
8093
|
break;
|
|
8089
8094
|
}
|
|
8090
8095
|
|
|
8091
|
-
return _context8.abrupt("return",
|
|
8096
|
+
return _context8.abrupt("return", foundElement);
|
|
8092
8097
|
|
|
8093
8098
|
case 8:
|
|
8094
|
-
|
|
8095
|
-
|
|
8099
|
+
if (!(!passLocked && hasClass(foundElement, "locked") && !hasClass(target, "passthrough"))) {
|
|
8100
|
+
_context8.next = 10;
|
|
8101
|
+
break;
|
|
8102
|
+
}
|
|
8096
8103
|
|
|
8097
|
-
|
|
8098
|
-
|
|
8104
|
+
return _context8.abrupt("return", returnLocked ? foundElement : null);
|
|
8105
|
+
|
|
8106
|
+
case 10:
|
|
8107
|
+
if (!hasClass(target, "passthrough")) {
|
|
8108
|
+
_context8.next = 28;
|
|
8099
8109
|
break;
|
|
8100
8110
|
}
|
|
8101
8111
|
|
|
8102
|
-
_context8.next =
|
|
8112
|
+
_context8.next = 13;
|
|
8103
8113
|
return snapshot.getPromise(ItemListAtom);
|
|
8104
8114
|
|
|
8105
|
-
case
|
|
8115
|
+
case 13:
|
|
8106
8116
|
itemList = _context8.sent;
|
|
8107
|
-
_context8.next =
|
|
8117
|
+
_context8.next = 16;
|
|
8108
8118
|
return snapshot.getPromise(ConfigurationAtom);
|
|
8109
8119
|
|
|
8110
|
-
case
|
|
8120
|
+
case 16:
|
|
8111
8121
|
_yield$snapshot$getPr2 = _context8.sent;
|
|
8112
8122
|
boardWrapper = _yield$snapshot$getPr2.boardWrapper;
|
|
8113
8123
|
// Found element under the cursor
|
|
@@ -8127,33 +8137,33 @@ var useItemActions = function useItemActions() {
|
|
|
8127
8137
|
|
|
8128
8138
|
i = 0;
|
|
8129
8139
|
|
|
8130
|
-
case
|
|
8140
|
+
case 20:
|
|
8131
8141
|
if (!(i < elems.length)) {
|
|
8132
|
-
_context8.next =
|
|
8142
|
+
_context8.next = 27;
|
|
8133
8143
|
break;
|
|
8134
8144
|
}
|
|
8135
8145
|
|
|
8136
8146
|
elem = elems[i];
|
|
8137
8147
|
|
|
8138
|
-
if (!(elem !== foundElement && (
|
|
8139
|
-
_context8.next =
|
|
8148
|
+
if (!(elem !== foundElement && (passLocked || !hasClass(elem, "locked")))) {
|
|
8149
|
+
_context8.next = 24;
|
|
8140
8150
|
break;
|
|
8141
8151
|
}
|
|
8142
8152
|
|
|
8143
8153
|
return _context8.abrupt("return", elem);
|
|
8144
8154
|
|
|
8145
|
-
case
|
|
8155
|
+
case 24:
|
|
8146
8156
|
i += 1;
|
|
8147
|
-
_context8.next =
|
|
8157
|
+
_context8.next = 20;
|
|
8148
8158
|
break;
|
|
8149
8159
|
|
|
8150
|
-
case
|
|
8160
|
+
case 27:
|
|
8151
8161
|
return _context8.abrupt("return", null);
|
|
8152
8162
|
|
|
8153
|
-
case
|
|
8163
|
+
case 28:
|
|
8154
8164
|
return _context8.abrupt("return", foundElement);
|
|
8155
8165
|
|
|
8156
|
-
case
|
|
8166
|
+
case 29:
|
|
8157
8167
|
case "end":
|
|
8158
8168
|
return _context8.stop();
|
|
8159
8169
|
}
|