@inditextech/weave-sdk 0.52.0 → 0.52.2
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/sdk.cjs +148 -98
- package/dist/sdk.d.cts +11 -2
- package/dist/sdk.d.cts.map +1 -1
- package/dist/sdk.d.ts +11 -2
- package/dist/sdk.d.ts.map +1 -1
- package/dist/sdk.js +148 -98
- package/dist/sdk.js.map +1 -1
- package/package.json +2 -2
package/dist/sdk.cjs
CHANGED
|
@@ -15674,7 +15674,7 @@ function containerOverCursor(instance, ignoreNodes, definedCursorPosition) {
|
|
|
15674
15674
|
stage.find(".containerCapable").reverse().forEach((node) => {
|
|
15675
15675
|
if (!node.isVisible()) return;
|
|
15676
15676
|
if (containsNodeDeep(ignoreNodes, node)) return;
|
|
15677
|
-
const shapeRect =
|
|
15677
|
+
const shapeRect = getBoundingBox(stage, [node]);
|
|
15678
15678
|
if (cursorPosition.x >= shapeRect.x && cursorPosition.x <= shapeRect.x + shapeRect.width && cursorPosition.y >= shapeRect.y && cursorPosition.y <= shapeRect.y + shapeRect.height) {
|
|
15679
15679
|
if (node?.getAttrs().isContainerPrincipal) containerUnderPointer.add(node);
|
|
15680
15680
|
}
|
|
@@ -15988,17 +15988,19 @@ var WeaveContextMenuPlugin = class extends WeavePlugin {
|
|
|
15988
15988
|
}
|
|
15989
15989
|
const containerRect = stage.container().getBoundingClientRect();
|
|
15990
15990
|
const pointerPos = stage.getPointerPosition();
|
|
15991
|
-
|
|
15991
|
+
const relativeClickPoint = stage.getRelativePointerPosition();
|
|
15992
|
+
if (containerRect && pointerPos && relativeClickPoint) {
|
|
15992
15993
|
const contextMenuPoint = {
|
|
15993
15994
|
x: containerRect.left + pointerPos.x + (this.config.xOffset ?? 4),
|
|
15994
15995
|
y: containerRect.top + pointerPos.y + (this.config.yOffset ?? 4)
|
|
15995
15996
|
};
|
|
15996
|
-
const
|
|
15997
|
+
const stageClickPoint = this.getStageClickPoint(pointerPos);
|
|
15997
15998
|
this.contextMenuVisible = true;
|
|
15998
15999
|
this.instance.emitEvent("onNodeContextMenu", {
|
|
15999
16000
|
selection: nodes,
|
|
16000
16001
|
contextMenuPoint,
|
|
16001
|
-
clickPoint,
|
|
16002
|
+
clickPoint: pointerPos,
|
|
16003
|
+
stageClickPoint,
|
|
16002
16004
|
visible: true
|
|
16003
16005
|
});
|
|
16004
16006
|
}
|
|
@@ -16015,6 +16017,10 @@ var WeaveContextMenuPlugin = class extends WeavePlugin {
|
|
|
16015
16017
|
x: 0,
|
|
16016
16018
|
y: 0
|
|
16017
16019
|
},
|
|
16020
|
+
stageClickPoint: {
|
|
16021
|
+
x: 0,
|
|
16022
|
+
y: 0
|
|
16023
|
+
},
|
|
16018
16024
|
visible: false
|
|
16019
16025
|
});
|
|
16020
16026
|
}
|
|
@@ -16071,16 +16077,27 @@ var WeaveContextMenuPlugin = class extends WeavePlugin {
|
|
|
16071
16077
|
x: containerRect.left + pointerPos.x + (this.config.xOffset ?? 4),
|
|
16072
16078
|
y: containerRect.top + pointerPos.y + (this.config.yOffset ?? 4)
|
|
16073
16079
|
};
|
|
16074
|
-
const
|
|
16080
|
+
const stageClickPoint = this.getStageClickPoint(pointerPos);
|
|
16075
16081
|
this.instance.emitEvent("onNodeContextMenu", {
|
|
16076
16082
|
selection: [],
|
|
16077
16083
|
contextMenuPoint,
|
|
16078
|
-
clickPoint,
|
|
16084
|
+
clickPoint: pointerPos,
|
|
16085
|
+
stageClickPoint,
|
|
16079
16086
|
visible: false
|
|
16080
16087
|
});
|
|
16081
16088
|
}
|
|
16082
16089
|
});
|
|
16083
16090
|
}
|
|
16091
|
+
getStageClickPoint(pointerPos) {
|
|
16092
|
+
const stage = this.instance.getStage();
|
|
16093
|
+
const scale = stage.scale();
|
|
16094
|
+
const position = stage.position();
|
|
16095
|
+
const stageClickPoint = {
|
|
16096
|
+
x: (pointerPos.x - position.x) / scale.x,
|
|
16097
|
+
y: (pointerPos.y - position.y) / scale.y
|
|
16098
|
+
};
|
|
16099
|
+
return stageClickPoint;
|
|
16100
|
+
}
|
|
16084
16101
|
isContextMenuVisible() {
|
|
16085
16102
|
return this.contextMenuVisible;
|
|
16086
16103
|
}
|
|
@@ -16227,6 +16244,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
|
|
|
16227
16244
|
"bottom-right"
|
|
16228
16245
|
];
|
|
16229
16246
|
this.taps = 0;
|
|
16247
|
+
this.isSpaceKeyPressed = false;
|
|
16230
16248
|
this.isDoubleTap = false;
|
|
16231
16249
|
this.tapStart = {
|
|
16232
16250
|
x: 0,
|
|
@@ -16557,11 +16575,15 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
|
|
|
16557
16575
|
this.selecting = false;
|
|
16558
16576
|
const stage = this.instance.getStage();
|
|
16559
16577
|
stage.container().addEventListener("keydown", (e) => {
|
|
16578
|
+
if (e.code === "Space") this.isSpaceKeyPressed = true;
|
|
16560
16579
|
if ((e.key === "Backspace" || e.key === "Delete") && Object.keys(window.weaveTextEditing).length === 0) {
|
|
16561
16580
|
this.removeSelectedNodes();
|
|
16562
16581
|
return;
|
|
16563
16582
|
}
|
|
16564
16583
|
});
|
|
16584
|
+
stage.container().addEventListener("keyup", (e) => {
|
|
16585
|
+
if (e.key === "Space") this.isSpaceKeyPressed = false;
|
|
16586
|
+
});
|
|
16565
16587
|
stage.on("pointerdown", (e) => {
|
|
16566
16588
|
this.setTapStart(e);
|
|
16567
16589
|
this.pointers[e.evt.pointerId] = e.evt;
|
|
@@ -16614,6 +16636,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
|
|
|
16614
16636
|
this.selecting = false;
|
|
16615
16637
|
return;
|
|
16616
16638
|
}
|
|
16639
|
+
if (this.isSpaceKeyPressed) return;
|
|
16617
16640
|
if (!this.selecting) return;
|
|
16618
16641
|
const intStage = this.instance.getStage();
|
|
16619
16642
|
x2 = intStage.getRelativePointerPosition()?.x ?? 0;
|
|
@@ -16656,7 +16679,6 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
|
|
|
16656
16679
|
y: 0,
|
|
16657
16680
|
time: 0
|
|
16658
16681
|
};
|
|
16659
|
-
this.isDoubleTap = true;
|
|
16660
16682
|
this.hideSelectorArea();
|
|
16661
16683
|
this.handleClickOrTap(e);
|
|
16662
16684
|
return;
|
|
@@ -16788,6 +16810,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
|
|
|
16788
16810
|
}
|
|
16789
16811
|
if (typeof nodeTargeted.getAttrs().isContainerPrincipal !== "undefined" && !nodeTargeted.getAttrs().isContainerPrincipal) return;
|
|
16790
16812
|
if (this.isDoubleTap && !metaPressed) {
|
|
16813
|
+
this.isDoubleTap = false;
|
|
16791
16814
|
nodeTargeted.dblClick();
|
|
16792
16815
|
return;
|
|
16793
16816
|
}
|
|
@@ -16951,6 +16974,8 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
16951
16974
|
catcher.style.zIndex = "-1";
|
|
16952
16975
|
catcher.style.outline = "none";
|
|
16953
16976
|
catcher.style.opacity = "0";
|
|
16977
|
+
catcher.onpaste = () => false;
|
|
16978
|
+
catcher.oncontextmenu = () => false;
|
|
16954
16979
|
catcher.tabIndex = 0;
|
|
16955
16980
|
const stageContainer = stage.container();
|
|
16956
16981
|
if (stageContainer?.parentNode) stageContainer.parentNode.appendChild(catcher);
|
|
@@ -16975,47 +17000,47 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
16975
17000
|
if (!this.enabled) return;
|
|
16976
17001
|
}
|
|
16977
17002
|
});
|
|
16978
|
-
if (catcher)
|
|
16979
|
-
|
|
16980
|
-
|
|
16981
|
-
|
|
16982
|
-
|
|
16983
|
-
if (
|
|
16984
|
-
|
|
16985
|
-
|
|
16986
|
-
|
|
16987
|
-
|
|
16988
|
-
|
|
16989
|
-
|
|
16990
|
-
|
|
16991
|
-
|
|
16992
|
-
|
|
16993
|
-
|
|
16994
|
-
|
|
16995
|
-
this.
|
|
17003
|
+
if (catcher) {
|
|
17004
|
+
document.addEventListener("paste", (e) => {
|
|
17005
|
+
e.preventDefault();
|
|
17006
|
+
const dataList = e.clipboardData?.items;
|
|
17007
|
+
if (!dataList) return;
|
|
17008
|
+
if (dataList?.length > 0) {
|
|
17009
|
+
const container = stage.container();
|
|
17010
|
+
const scale = stage.scale();
|
|
17011
|
+
const position = stage.position();
|
|
17012
|
+
const width = container.clientWidth;
|
|
17013
|
+
const height = container.clientHeight;
|
|
17014
|
+
const centerX = (width / 2 - position.x) / scale.x;
|
|
17015
|
+
const centerY = (height / 2 - position.y) / scale.y;
|
|
17016
|
+
const pastePosition = {
|
|
17017
|
+
x: centerX,
|
|
17018
|
+
y: centerY
|
|
17019
|
+
};
|
|
17020
|
+
this.instance.emitEvent("onPasteExternal", {
|
|
17021
|
+
positionCalculated: true,
|
|
17022
|
+
position: pastePosition,
|
|
17023
|
+
dataList,
|
|
17024
|
+
items: void 0
|
|
17025
|
+
});
|
|
16996
17026
|
}
|
|
16997
|
-
}
|
|
16998
|
-
if (hasWeaveData) {
|
|
16999
|
-
this.handlePaste();
|
|
17000
|
-
return;
|
|
17001
|
-
}
|
|
17002
|
-
const container = stage.container();
|
|
17003
|
-
const scale = stage.scale();
|
|
17004
|
-
const position = stage.position();
|
|
17005
|
-
const width = container.clientWidth;
|
|
17006
|
-
const height = container.clientHeight;
|
|
17007
|
-
const centerX = (width / 2 - position.x) / scale.x;
|
|
17008
|
-
const centerY = (height / 2 - position.y) / scale.y;
|
|
17009
|
-
const pastePosition = {
|
|
17010
|
-
x: centerX,
|
|
17011
|
-
y: centerY
|
|
17012
|
-
};
|
|
17013
|
-
this.instance.emitEvent("onPasteExternal", {
|
|
17014
|
-
position: pastePosition,
|
|
17015
|
-
dataList,
|
|
17016
|
-
items
|
|
17017
17027
|
});
|
|
17018
|
-
|
|
17028
|
+
catcher.addEventListener("paste", async (e) => {
|
|
17029
|
+
e.preventDefault();
|
|
17030
|
+
let items = void 0;
|
|
17031
|
+
let hasWeaveData = false;
|
|
17032
|
+
if (!items) {
|
|
17033
|
+
if (this.isClipboardAPIAvailable()) items = await navigator.clipboard.read();
|
|
17034
|
+
}
|
|
17035
|
+
if (!items || items.length === 0) return;
|
|
17036
|
+
if (this.isClipboardAPIAvailable()) {
|
|
17037
|
+
const readText = await navigator.clipboard.readText();
|
|
17038
|
+
const continueToPaste = this.isWeaveData(readText);
|
|
17039
|
+
if (continueToPaste) hasWeaveData = true;
|
|
17040
|
+
}
|
|
17041
|
+
if (hasWeaveData) this.handlePaste();
|
|
17042
|
+
});
|
|
17043
|
+
}
|
|
17019
17044
|
}
|
|
17020
17045
|
isWeaveData(text) {
|
|
17021
17046
|
try {
|
|
@@ -17030,13 +17055,6 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17030
17055
|
return false;
|
|
17031
17056
|
}
|
|
17032
17057
|
}
|
|
17033
|
-
getTextFromClipboard(item) {
|
|
17034
|
-
return new Promise((resolve) => {
|
|
17035
|
-
item.getAsString((text) => {
|
|
17036
|
-
resolve(text);
|
|
17037
|
-
});
|
|
17038
|
-
});
|
|
17039
|
-
}
|
|
17040
17058
|
mapToPasteNodes() {
|
|
17041
17059
|
const nodesSelectionPlugin = this.getNodesSelectionPlugin();
|
|
17042
17060
|
const selectedNodes = nodesSelectionPlugin?.getSelectedNodes();
|
|
@@ -17056,7 +17074,7 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17056
17074
|
if (child.props.children) this.recursivelyUpdateKeys(child.props.children);
|
|
17057
17075
|
}
|
|
17058
17076
|
}
|
|
17059
|
-
handlePaste(position) {
|
|
17077
|
+
handlePaste(position, relativePosition) {
|
|
17060
17078
|
const stage = this.instance.getStage();
|
|
17061
17079
|
if (this.toPaste) {
|
|
17062
17080
|
const nodesToSelect = [];
|
|
@@ -17070,7 +17088,7 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17070
17088
|
node.key = newNodeId;
|
|
17071
17089
|
node.props.id = newNodeId;
|
|
17072
17090
|
if (position) {
|
|
17073
|
-
const container = containerOverCursor(this.instance, [],
|
|
17091
|
+
const container = containerOverCursor(this.instance, [], relativePosition);
|
|
17074
17092
|
let localPos = position;
|
|
17075
17093
|
if (!container) {
|
|
17076
17094
|
containerId = this.instance.getMainLayer()?.getAttrs().id ?? "";
|
|
@@ -17153,13 +17171,13 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17153
17171
|
async copy() {
|
|
17154
17172
|
await this.performCopy();
|
|
17155
17173
|
}
|
|
17156
|
-
async paste(position) {
|
|
17174
|
+
async paste(position, relativePosition) {
|
|
17157
17175
|
const stage = this.instance.getStage();
|
|
17158
17176
|
try {
|
|
17159
17177
|
const readText = await navigator.clipboard.readText();
|
|
17160
17178
|
const continueToPaste = this.isWeaveData(readText);
|
|
17161
17179
|
if (continueToPaste) {
|
|
17162
|
-
this.handlePaste(position);
|
|
17180
|
+
this.handlePaste(position, relativePosition);
|
|
17163
17181
|
return;
|
|
17164
17182
|
}
|
|
17165
17183
|
} catch (ex) {
|
|
@@ -17167,8 +17185,10 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17167
17185
|
}
|
|
17168
17186
|
try {
|
|
17169
17187
|
const items = await navigator.clipboard.read();
|
|
17170
|
-
let
|
|
17188
|
+
let positionCalculated = false;
|
|
17189
|
+
let pastePosition = relativePosition;
|
|
17171
17190
|
if (typeof pastePosition === "undefined") {
|
|
17191
|
+
positionCalculated = true;
|
|
17172
17192
|
const container = stage.container();
|
|
17173
17193
|
const scale = stage.scale();
|
|
17174
17194
|
const position$1 = stage.position();
|
|
@@ -17182,6 +17202,7 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
|
|
|
17182
17202
|
};
|
|
17183
17203
|
}
|
|
17184
17204
|
this.instance.emitEvent("onPasteExternal", {
|
|
17205
|
+
positionCalculated,
|
|
17185
17206
|
position: pastePosition,
|
|
17186
17207
|
items
|
|
17187
17208
|
});
|
|
@@ -19148,7 +19169,7 @@ var WeaveRegisterManager = class {
|
|
|
19148
19169
|
|
|
19149
19170
|
//#endregion
|
|
19150
19171
|
//#region package.json
|
|
19151
|
-
var version = "0.52.
|
|
19172
|
+
var version = "0.52.2";
|
|
19152
19173
|
|
|
19153
19174
|
//#endregion
|
|
19154
19175
|
//#region src/managers/setup.ts
|
|
@@ -19730,6 +19751,15 @@ var Weave = class {
|
|
|
19730
19751
|
isEmpty() {
|
|
19731
19752
|
return this.getElementsTree().length === 0;
|
|
19732
19753
|
}
|
|
19754
|
+
getNodeContainerId(node) {
|
|
19755
|
+
const stage = this.getStage();
|
|
19756
|
+
let nodeContainer = node.getParent()?.getAttrs().id ?? "";
|
|
19757
|
+
if (typeof node.getParent()?.getAttrs().nodeId !== "undefined") {
|
|
19758
|
+
const realContainer = stage.findOne(`#${node.getParent()?.getAttrs().nodeId}`);
|
|
19759
|
+
if (realContainer) nodeContainer = realContainer.getAttrs().id ?? "";
|
|
19760
|
+
}
|
|
19761
|
+
return nodeContainer;
|
|
19762
|
+
}
|
|
19733
19763
|
moveUp(node) {
|
|
19734
19764
|
this.zIndexManager.moveUp(node);
|
|
19735
19765
|
}
|
|
@@ -20154,7 +20184,7 @@ var WeaveEllipseNode = class extends WeaveNode {
|
|
|
20154
20184
|
ellipse.allowedAnchors = () => {
|
|
20155
20185
|
const stage = this.instance.getStage();
|
|
20156
20186
|
const actualEllipse = stage.findOne(`#${ellipse.id()}`);
|
|
20157
|
-
if (actualEllipse
|
|
20187
|
+
if (actualEllipse?.getAttrs()?.keepAspectRatio) return [
|
|
20158
20188
|
"top-left",
|
|
20159
20189
|
"top-right",
|
|
20160
20190
|
"bottom-left",
|
|
@@ -20739,6 +20769,7 @@ var WeaveImageToolAction = class extends WeaveAction {
|
|
|
20739
20769
|
initialized = false;
|
|
20740
20770
|
initialCursor = null;
|
|
20741
20771
|
cursorPadding = 5;
|
|
20772
|
+
forceMainContainer = false;
|
|
20742
20773
|
onPropsChange = void 0;
|
|
20743
20774
|
update = void 0;
|
|
20744
20775
|
constructor() {
|
|
@@ -20920,7 +20951,7 @@ var WeaveImageToolAction = class extends WeaveAction {
|
|
|
20920
20951
|
height: this.preloadImgs[this.imageId].height
|
|
20921
20952
|
}
|
|
20922
20953
|
});
|
|
20923
|
-
this.instance.addNode(node, this.container?.getAttrs().id);
|
|
20954
|
+
this.instance.addNode(node, this.forceMainContainer ? this.instance.getMainLayer()?.getAttrs().id : this.container?.getAttrs().id);
|
|
20924
20955
|
this.instance.emitEvent("onAddedImage", {
|
|
20925
20956
|
imageURL: this.props.imageURL,
|
|
20926
20957
|
nodeId: this.imageId
|
|
@@ -20936,6 +20967,7 @@ var WeaveImageToolAction = class extends WeaveAction {
|
|
|
20936
20967
|
this.cancelAction = cancelAction;
|
|
20937
20968
|
const selectionPlugin = this.instance.getPlugin("nodesSelection");
|
|
20938
20969
|
if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
|
|
20970
|
+
this.forceMainContainer = params?.forceMainContainer ?? false;
|
|
20939
20971
|
if (params?.imageURL) {
|
|
20940
20972
|
this.loadImage(params.imageURL, params?.options ?? void 0, params?.position ?? void 0);
|
|
20941
20973
|
return;
|
|
@@ -20957,7 +20989,9 @@ var WeaveImageToolAction = class extends WeaveAction {
|
|
|
20957
20989
|
stage.container().style.cursor = "default";
|
|
20958
20990
|
this.initialCursor = null;
|
|
20959
20991
|
this.imageId = null;
|
|
20992
|
+
this.forceMainContainer = false;
|
|
20960
20993
|
this.container = void 0;
|
|
20994
|
+
this.tempImageNode = null;
|
|
20961
20995
|
this.imageURL = null;
|
|
20962
20996
|
this.clickPoint = null;
|
|
20963
20997
|
this.setState(IMAGE_TOOL_STATE.IDLE);
|
|
@@ -20973,19 +21007,19 @@ var WeaveImageCrop = class WeaveImageCrop {
|
|
|
20973
21007
|
this.image = image;
|
|
20974
21008
|
this.internalImage = internalImage;
|
|
20975
21009
|
this.cropGroup = clipGroup;
|
|
21010
|
+
this.cropping = false;
|
|
20976
21011
|
this.onClose = () => {};
|
|
20977
21012
|
this.handleHide = this.hide.bind(this);
|
|
20978
21013
|
}
|
|
20979
21014
|
show(onClose) {
|
|
20980
21015
|
this.onClose = onClose;
|
|
20981
|
-
|
|
20982
|
-
|
|
20983
|
-
|
|
20984
|
-
|
|
20985
|
-
|
|
20986
|
-
|
|
20987
|
-
|
|
20988
|
-
}
|
|
21016
|
+
this.cropping = true;
|
|
21017
|
+
const nodeEdgeSnappingPlugin = this.getNodesEdgeSnappingPlugin();
|
|
21018
|
+
if (nodeEdgeSnappingPlugin) nodeEdgeSnappingPlugin.disable();
|
|
21019
|
+
const nodeDistanceSnappingPlugin = this.getNodesDistanceSnappingPlugin();
|
|
21020
|
+
if (nodeDistanceSnappingPlugin) nodeDistanceSnappingPlugin.disable();
|
|
21021
|
+
const nodesSelectionPlugin = this.getNodesSelectionPlugin();
|
|
21022
|
+
if (nodesSelectionPlugin) nodesSelectionPlugin.disable();
|
|
20989
21023
|
this.image.setAttrs({ cropping: true });
|
|
20990
21024
|
const imageAttrs = this.image.getAttrs();
|
|
20991
21025
|
this.internalImage.hide();
|
|
@@ -21105,6 +21139,7 @@ var WeaveImageCrop = class WeaveImageCrop {
|
|
|
21105
21139
|
this.drawGridLines(cropRect$1.x, cropRect$1.y, cropRect$1.width, cropRect$1.height);
|
|
21106
21140
|
};
|
|
21107
21141
|
this.instance.getStage().on("pointerdown", (e) => {
|
|
21142
|
+
if (!this.cropping) return;
|
|
21108
21143
|
const isStage = e.target instanceof konva.default.Stage;
|
|
21109
21144
|
const isContainerEmptyArea = typeof e.target.getAttrs().isContainerPrincipal !== "undefined" && !e.target.getAttrs().isContainerPrincipal;
|
|
21110
21145
|
if (isStage || isContainerEmptyArea) this.cancel();
|
|
@@ -21144,6 +21179,7 @@ var WeaveImageCrop = class WeaveImageCrop {
|
|
|
21144
21179
|
}
|
|
21145
21180
|
hide(e) {
|
|
21146
21181
|
if (!["Enter", "Escape"].includes(e.key)) return;
|
|
21182
|
+
this.cropping = false;
|
|
21147
21183
|
this.image.setAttrs({ cropping: false });
|
|
21148
21184
|
if (e.key === "Enter") this.handleClipEnd();
|
|
21149
21185
|
const stage = this.instance.getStage();
|
|
@@ -21153,20 +21189,13 @@ var WeaveImageCrop = class WeaveImageCrop {
|
|
|
21153
21189
|
this.instance.getStage().container().removeEventListener("keydown", this.handleHide);
|
|
21154
21190
|
this.cropGroup.destroyChildren();
|
|
21155
21191
|
this.cropGroup.hide();
|
|
21156
|
-
const
|
|
21157
|
-
if (
|
|
21192
|
+
const nodesEdgeSnappingPlugin = this.getNodesEdgeSnappingPlugin();
|
|
21193
|
+
if (nodesEdgeSnappingPlugin) nodesEdgeSnappingPlugin.enable();
|
|
21194
|
+
const nodesDistanceSnappingPlugin = this.getNodesDistanceSnappingPlugin();
|
|
21195
|
+
if (nodesDistanceSnappingPlugin) nodesDistanceSnappingPlugin.enable();
|
|
21158
21196
|
this.internalImage.show();
|
|
21159
|
-
const
|
|
21160
|
-
if (
|
|
21161
|
-
this.instance.enablePlugin("nodesSelection");
|
|
21162
|
-
const selectionTransformer = selectionPlugin.getTransformer();
|
|
21163
|
-
selectionTransformer.nodes([this.image]);
|
|
21164
|
-
selectionTransformer.show();
|
|
21165
|
-
setTimeout(() => {
|
|
21166
|
-
selectionPlugin.triggerSelectedNodesEvent();
|
|
21167
|
-
selectionTransformer.forceUpdate();
|
|
21168
|
-
}, 0);
|
|
21169
|
-
}
|
|
21197
|
+
const nodesSelectionPlugin = this.getNodesSelectionPlugin();
|
|
21198
|
+
if (nodesSelectionPlugin) nodesSelectionPlugin.enable();
|
|
21170
21199
|
stage.mode(WEAVE_STAGE_DEFAULT_MODE);
|
|
21171
21200
|
this.instance.emitEvent("onImageCropEnd", { instance: this.image });
|
|
21172
21201
|
}
|
|
@@ -21304,6 +21333,18 @@ var WeaveImageCrop = class WeaveImageCrop {
|
|
|
21304
21333
|
y: a.y + t * ab.y
|
|
21305
21334
|
};
|
|
21306
21335
|
}
|
|
21336
|
+
getNodesEdgeSnappingPlugin() {
|
|
21337
|
+
const snappingEdgesPlugin = this.instance.getPlugin(WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY);
|
|
21338
|
+
return snappingEdgesPlugin;
|
|
21339
|
+
}
|
|
21340
|
+
getNodesDistanceSnappingPlugin() {
|
|
21341
|
+
const snappingDistancePlugin = this.instance.getPlugin(WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY);
|
|
21342
|
+
return snappingDistancePlugin;
|
|
21343
|
+
}
|
|
21344
|
+
getNodesSelectionPlugin() {
|
|
21345
|
+
const nodesSelectionPlugin = this.instance.getPlugin(WEAVE_NODES_SELECTION_KEY);
|
|
21346
|
+
return nodesSelectionPlugin;
|
|
21347
|
+
}
|
|
21307
21348
|
};
|
|
21308
21349
|
|
|
21309
21350
|
//#endregion
|
|
@@ -21567,12 +21608,6 @@ var WeaveImageNode = class extends WeaveNode {
|
|
|
21567
21608
|
});
|
|
21568
21609
|
this.updateImageCrop(nextProps);
|
|
21569
21610
|
}
|
|
21570
|
-
try {
|
|
21571
|
-
const selectionPlugin = this.instance.getPlugin("nodesSelection");
|
|
21572
|
-
if (selectionPlugin) selectionPlugin.getTransformer().forceUpdate();
|
|
21573
|
-
} catch (error) {
|
|
21574
|
-
console.error("Error updating transformer", error);
|
|
21575
|
-
}
|
|
21576
21611
|
}
|
|
21577
21612
|
loadImage(params, image) {
|
|
21578
21613
|
const imageProps = params;
|
|
@@ -25560,6 +25595,10 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
|
|
|
25560
25595
|
window.addEventListener("keydown", (e) => {
|
|
25561
25596
|
if (e.ctrlKey || e.metaKey) this.isCtrlOrMetaPressed = true;
|
|
25562
25597
|
if (e.code === "Space") {
|
|
25598
|
+
this.getContextMenuPlugin()?.disable();
|
|
25599
|
+
this.getNodesSelectionPlugin()?.disable();
|
|
25600
|
+
this.getNodesEdgeSnappingPlugin()?.disable();
|
|
25601
|
+
this.getNodesDistanceSnappingPlugin()?.disable();
|
|
25563
25602
|
this.isSpaceKeyPressed = true;
|
|
25564
25603
|
this.enableMove();
|
|
25565
25604
|
}
|
|
@@ -25567,6 +25606,10 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
|
|
|
25567
25606
|
window.addEventListener("keyup", (e) => {
|
|
25568
25607
|
if (e.key === "Meta" || e.key === "Control") this.isCtrlOrMetaPressed = false;
|
|
25569
25608
|
if (e.code === "Space") {
|
|
25609
|
+
this.getContextMenuPlugin()?.enable();
|
|
25610
|
+
this.getNodesSelectionPlugin()?.enable();
|
|
25611
|
+
this.getNodesEdgeSnappingPlugin()?.enable();
|
|
25612
|
+
this.getNodesDistanceSnappingPlugin()?.enable();
|
|
25570
25613
|
this.isSpaceKeyPressed = false;
|
|
25571
25614
|
this.disableMove();
|
|
25572
25615
|
}
|
|
@@ -25581,14 +25624,9 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
|
|
|
25581
25624
|
if (this.pointers.size > 1) return;
|
|
25582
25625
|
const activeAction = this.instance.getActiveAction();
|
|
25583
25626
|
let enableMove = false;
|
|
25584
|
-
if (e && (e.evt.pointerType !== "mouse" || e.evt.pointerType === "mouse" && e.evt.buttons === 1) && activeAction === MOVE_TOOL_ACTION_NAME)
|
|
25585
|
-
|
|
25586
|
-
|
|
25587
|
-
}
|
|
25588
|
-
if (!enableMove && e.evt.pointerType === "mouse" && e.evt.buttons === 4) {
|
|
25589
|
-
this.isMouseMiddleButtonPressed = true;
|
|
25590
|
-
enableMove = true;
|
|
25591
|
-
}
|
|
25627
|
+
if (e && (e.evt.pointerType !== "mouse" || e.evt.pointerType === "mouse" && e.evt.buttons === 1) && activeAction === MOVE_TOOL_ACTION_NAME) this.moveToolActive = true;
|
|
25628
|
+
if (!enableMove && e.evt.pointerType === "mouse" && e.evt.buttons === 4) this.isMouseMiddleButtonPressed = true;
|
|
25629
|
+
if (this.enabled && (this.isSpaceKeyPressed || this.moveToolActive || this.isMouseMiddleButtonPressed)) enableMove = true;
|
|
25592
25630
|
if (enableMove) {
|
|
25593
25631
|
isDragging = true;
|
|
25594
25632
|
lastPos = stage.getPointerPosition();
|
|
@@ -25605,8 +25643,8 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
|
|
|
25605
25643
|
y: e.evt.clientY
|
|
25606
25644
|
});
|
|
25607
25645
|
if (this.pointers.size > 1) return;
|
|
25646
|
+
if (this.isSpaceKeyPressed) stage.container().style.cursor = "grabbing";
|
|
25608
25647
|
if (!isDragging) return;
|
|
25609
|
-
if (!this.enabled || !(this.isSpaceKeyPressed || this.isMouseMiddleButtonPressed || this.moveToolActive)) return;
|
|
25610
25648
|
this.getContextMenuPlugin()?.cancelLongPressTimer();
|
|
25611
25649
|
const pos = stage.getPointerPosition();
|
|
25612
25650
|
if (pos && lastPos) {
|
|
@@ -25665,9 +25703,21 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
|
|
|
25665
25703
|
return zoomPlugin;
|
|
25666
25704
|
}
|
|
25667
25705
|
getContextMenuPlugin() {
|
|
25668
|
-
const contextMenuPlugin = this.instance.getPlugin(
|
|
25706
|
+
const contextMenuPlugin = this.instance.getPlugin(WEAVE_CONTEXT_MENU_PLUGIN_KEY);
|
|
25669
25707
|
return contextMenuPlugin;
|
|
25670
25708
|
}
|
|
25709
|
+
getNodesSelectionPlugin() {
|
|
25710
|
+
const selectionPlugin = this.instance.getPlugin(WEAVE_NODES_SELECTION_KEY);
|
|
25711
|
+
return selectionPlugin;
|
|
25712
|
+
}
|
|
25713
|
+
getNodesEdgeSnappingPlugin() {
|
|
25714
|
+
const snappingPlugin = this.instance.getPlugin(WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY);
|
|
25715
|
+
return snappingPlugin;
|
|
25716
|
+
}
|
|
25717
|
+
getNodesDistanceSnappingPlugin() {
|
|
25718
|
+
const snappingPlugin = this.instance.getPlugin(WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY);
|
|
25719
|
+
return snappingPlugin;
|
|
25720
|
+
}
|
|
25671
25721
|
enable() {
|
|
25672
25722
|
this.enabled = true;
|
|
25673
25723
|
}
|
package/dist/sdk.d.cts
CHANGED
|
@@ -289,6 +289,7 @@ type WeaveStageContextMenuPluginOnNodeContextMenuEvent = {
|
|
|
289
289
|
selection: WeaveSelection[];
|
|
290
290
|
contextMenuPoint: Vector2d;
|
|
291
291
|
clickPoint: Vector2d;
|
|
292
|
+
stageClickPoint: Vector2d;
|
|
292
293
|
visible: boolean;
|
|
293
294
|
};
|
|
294
295
|
|
|
@@ -320,6 +321,7 @@ declare class WeaveContextMenuPlugin extends WeavePlugin {
|
|
|
320
321
|
private getSelectionPlugin;
|
|
321
322
|
cancelLongPressTimer(): void;
|
|
322
323
|
private initEvents;
|
|
324
|
+
private getStageClickPoint;
|
|
323
325
|
isContextMenuVisible(): boolean;
|
|
324
326
|
isTapHold(): boolean;
|
|
325
327
|
enable(): void;
|
|
@@ -515,6 +517,7 @@ declare class WeaveNodesSelectionPlugin extends WeavePlugin {
|
|
|
515
517
|
private didMove;
|
|
516
518
|
private initialized;
|
|
517
519
|
private readonly selectionOriginalConfig;
|
|
520
|
+
private isSpaceKeyPressed;
|
|
518
521
|
protected taps: number;
|
|
519
522
|
protected isDoubleTap: boolean;
|
|
520
523
|
protected tapStart: {
|
|
@@ -779,6 +782,7 @@ declare class Weave {
|
|
|
779
782
|
moveNode(node: WeaveStateElement, position: WeavePosition): void;
|
|
780
783
|
getElementsTree(): WeaveStateElement[];
|
|
781
784
|
isEmpty(): boolean;
|
|
785
|
+
getNodeContainerId(node: WeaveElementInstance | Konva.Node): string;
|
|
782
786
|
moveUp(node: WeaveElementInstance): void;
|
|
783
787
|
moveDown(node: WeaveElementInstance): void;
|
|
784
788
|
sendToBack(nodes: WeaveElementInstance | WeaveElementInstance[]): void;
|
|
@@ -1815,6 +1819,7 @@ type WeaveImageToolActionTriggerParams = {
|
|
|
1815
1819
|
imageURL?: string;
|
|
1816
1820
|
options?: ImageOptions;
|
|
1817
1821
|
position?: Vector2d;
|
|
1822
|
+
forceMainContainer?: boolean;
|
|
1818
1823
|
stagePosition?: Vector2d;
|
|
1819
1824
|
};
|
|
1820
1825
|
type ImageOptions = {
|
|
@@ -1840,6 +1845,7 @@ declare class WeaveImageToolAction extends WeaveAction {
|
|
|
1840
1845
|
protected imageURL: string | null;
|
|
1841
1846
|
protected preloadImgs: Record<string, HTMLImageElement>;
|
|
1842
1847
|
protected clickPoint: Vector2d | null;
|
|
1848
|
+
protected forceMainContainer: boolean;
|
|
1843
1849
|
protected cancelAction: () => void;
|
|
1844
1850
|
onPropsChange: undefined;
|
|
1845
1851
|
update: undefined;
|
|
@@ -2387,6 +2393,9 @@ declare class WeaveStagePanningPlugin extends WeavePlugin {
|
|
|
2387
2393
|
} | null;
|
|
2388
2394
|
getZoomPlugin(): WeaveStageZoomPlugin | undefined;
|
|
2389
2395
|
getContextMenuPlugin(): WeaveContextMenuPlugin | undefined;
|
|
2396
|
+
getNodesSelectionPlugin(): WeaveNodesSelectionPlugin | undefined;
|
|
2397
|
+
getNodesEdgeSnappingPlugin(): WeaveNodesEdgeSnappingPlugin | undefined;
|
|
2398
|
+
getNodesDistanceSnappingPlugin(): WeaveNodesDistanceSnappingPlugin | undefined;
|
|
2390
2399
|
enable(): void;
|
|
2391
2400
|
disable(): void;
|
|
2392
2401
|
}
|
|
@@ -2612,6 +2621,7 @@ type WeaveCopyPasteNodesPluginOnPasteEvent = Error | undefined;
|
|
|
2612
2621
|
type WeaveCopyPasteNodesPluginOnPasteExternalEvent = {
|
|
2613
2622
|
items?: ClipboardItems;
|
|
2614
2623
|
dataList?: DataTransferItemList;
|
|
2624
|
+
positionCalculated: boolean;
|
|
2615
2625
|
position: Vector2d;
|
|
2616
2626
|
};
|
|
2617
2627
|
type WeaveCopyPastePasteModeKeys = keyof typeof WEAVE_COPY_PASTE_PASTE_MODES;
|
|
@@ -2648,14 +2658,13 @@ declare class WeaveCopyPasteNodesPlugin extends WeavePlugin {
|
|
|
2648
2658
|
private focusPasteCatcher;
|
|
2649
2659
|
initEvents(): void;
|
|
2650
2660
|
private isWeaveData;
|
|
2651
|
-
private getTextFromClipboard;
|
|
2652
2661
|
private mapToPasteNodes;
|
|
2653
2662
|
private setState;
|
|
2654
2663
|
private recursivelyUpdateKeys;
|
|
2655
2664
|
private handlePaste;
|
|
2656
2665
|
private performCopy;
|
|
2657
2666
|
copy(): Promise<void>;
|
|
2658
|
-
paste(position?: Vector2d): Promise<void>;
|
|
2667
|
+
paste(position?: Vector2d, relativePosition?: Vector2d): Promise<void>;
|
|
2659
2668
|
getSelectedNodes(): WeaveToPasteNode[];
|
|
2660
2669
|
isPasting(): boolean;
|
|
2661
2670
|
private cancel;
|