fix: context menu positioning (#4025)

This commit is contained in:
Shubham Shah 2021-10-04 15:43:17 +05:30 committed by GitHub
parent bea4a1e066
commit 75aeaa6c38
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -4092,116 +4092,112 @@ class App extends React.Component<AppProps, AppState> {
actionToggleStats, actionToggleStats,
]; ];
ContextMenu.push({
options: viewModeOptions,
top,
left,
actionManager: this.actionManager,
appState: this.state,
container: this.excalidrawContainerRef.current!,
});
if (this.state.viewModeEnabled) { if (this.state.viewModeEnabled) {
return; ContextMenu.push({
} options: viewModeOptions,
top,
ContextMenu.push({ left,
options: [ actionManager: this.actionManager,
this.isMobile && appState: this.state,
navigator.clipboard && { container: this.excalidrawContainerRef.current!,
name: "paste", });
perform: (elements, appStates) => { } else {
this.pasteFromClipboard(null); ContextMenu.push({
return { options: [
commitToHistory: false, this.isMobile &&
}; navigator.clipboard && {
name: "paste",
perform: (elements, appStates) => {
this.pasteFromClipboard(null);
return {
commitToHistory: false,
};
},
contextItemLabel: "labels.paste",
}, },
contextItemLabel: "labels.paste", this.isMobile && navigator.clipboard && separator,
}, probablySupportsClipboardBlob &&
this.isMobile && navigator.clipboard && separator, elements.length > 0 &&
probablySupportsClipboardBlob && actionCopyAsPng,
elements.length > 0 && probablySupportsClipboardWriteText &&
actionCopyAsPng, elements.length > 0 &&
probablySupportsClipboardWriteText && actionCopyAsSvg,
elements.length > 0 && ((probablySupportsClipboardBlob && elements.length > 0) ||
actionCopyAsSvg, (probablySupportsClipboardWriteText && elements.length > 0)) &&
((probablySupportsClipboardBlob && elements.length > 0) || separator,
(probablySupportsClipboardWriteText && elements.length > 0)) && actionSelectAll,
separator, separator,
actionSelectAll, typeof this.props.gridModeEnabled === "undefined" &&
separator, actionToggleGridMode,
typeof this.props.gridModeEnabled === "undefined" && typeof this.props.zenModeEnabled === "undefined" &&
actionToggleGridMode, actionToggleZenMode,
typeof this.props.zenModeEnabled === "undefined" && typeof this.props.viewModeEnabled === "undefined" &&
actionToggleZenMode, actionToggleViewMode,
typeof this.props.viewModeEnabled === "undefined" && actionToggleStats,
actionToggleViewMode, ],
actionToggleStats, top,
], left,
top, actionManager: this.actionManager,
left, appState: this.state,
actionManager: this.actionManager, container: this.excalidrawContainerRef.current!,
appState: this.state, });
container: this.excalidrawContainerRef.current!, }
}); } else if (type === "element") {
return; if (this.state.viewModeEnabled) {
ContextMenu.push({
options: [navigator.clipboard && actionCopy, ...options],
top,
left,
actionManager: this.actionManager,
appState: this.state,
container: this.excalidrawContainerRef.current!,
});
} else {
ContextMenu.push({
options: [
this.isMobile && actionCut,
this.isMobile && navigator.clipboard && actionCopy,
this.isMobile &&
navigator.clipboard && {
name: "paste",
perform: (elements, appStates) => {
this.pasteFromClipboard(null);
return {
commitToHistory: false,
};
},
contextItemLabel: "labels.paste",
},
this.isMobile && separator,
...options,
separator,
actionCopyStyles,
actionPasteStyles,
separator,
maybeGroupAction && actionGroup,
maybeUngroupAction && actionUngroup,
(maybeGroupAction || maybeUngroupAction) && separator,
actionAddToLibrary,
separator,
actionSendBackward,
actionBringForward,
actionSendToBack,
actionBringToFront,
separator,
maybeFlipHorizontal && actionFlipHorizontal,
maybeFlipVertical && actionFlipVertical,
(maybeFlipHorizontal || maybeFlipVertical) && separator,
actionDuplicateSelection,
actionDeleteSelected,
],
top,
left,
actionManager: this.actionManager,
appState: this.state,
container: this.excalidrawContainerRef.current!,
});
}
} }
if (this.state.viewModeEnabled) {
ContextMenu.push({
options: [navigator.clipboard && actionCopy, ...options],
top,
left,
actionManager: this.actionManager,
appState: this.state,
container: this.excalidrawContainerRef.current!,
});
return;
}
ContextMenu.push({
options: [
this.isMobile && actionCut,
this.isMobile && navigator.clipboard && actionCopy,
this.isMobile &&
navigator.clipboard && {
name: "paste",
perform: (elements, appStates) => {
this.pasteFromClipboard(null);
return {
commitToHistory: false,
};
},
contextItemLabel: "labels.paste",
},
this.isMobile && separator,
...options,
separator,
actionCopyStyles,
actionPasteStyles,
separator,
maybeGroupAction && actionGroup,
maybeUngroupAction && actionUngroup,
(maybeGroupAction || maybeUngroupAction) && separator,
actionAddToLibrary,
separator,
actionSendBackward,
actionBringForward,
actionSendToBack,
actionBringToFront,
separator,
maybeFlipHorizontal && actionFlipHorizontal,
maybeFlipVertical && actionFlipVertical,
(maybeFlipHorizontal || maybeFlipVertical) && separator,
actionDuplicateSelection,
actionDeleteSelected,
],
top,
left,
actionManager: this.actionManager,
appState: this.state,
container: this.excalidrawContainerRef.current!,
});
}; };
private handleWheel = withBatchedUpdates((event: WheelEvent) => { private handleWheel = withBatchedUpdates((event: WheelEvent) => {