mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
parent
7ab0c1aba8
commit
6428b59ccb
18 changed files with 599 additions and 20 deletions
|
@ -299,6 +299,9 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
});
|
||||
}}
|
||||
onLockToggle={this.toggleLock}
|
||||
onInsertShape={(elements) =>
|
||||
this.addElementsFromPasteOrLibrary(elements)
|
||||
}
|
||||
zenModeEnabled={zenModeEnabled}
|
||||
toggleZenMode={this.toggleZenMode}
|
||||
lng={getLanguage().lng}
|
||||
|
@ -870,7 +873,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
if (data.error) {
|
||||
alert(data.error);
|
||||
} else if (data.elements) {
|
||||
this.addElementsFromPaste(data.elements);
|
||||
this.addElementsFromPasteOrLibrary(data.elements);
|
||||
} else if (data.text) {
|
||||
this.addTextFromPaste(data.text);
|
||||
}
|
||||
|
@ -879,8 +882,10 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
},
|
||||
);
|
||||
|
||||
private addElementsFromPaste = (
|
||||
private addElementsFromPasteOrLibrary = (
|
||||
clipboardElements: readonly ExcalidrawElement[],
|
||||
clientX = cursorX,
|
||||
clientY = cursorY,
|
||||
) => {
|
||||
const [minX, minY, maxX, maxY] = getCommonBounds(clipboardElements);
|
||||
|
||||
|
@ -888,7 +893,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
const elementsCenterY = distance(minY, maxY) / 2;
|
||||
|
||||
const { x, y } = viewportCoordsToSceneCoords(
|
||||
{ clientX: cursorX, clientY: cursorY },
|
||||
{ clientX, clientY },
|
||||
this.state,
|
||||
this.canvas,
|
||||
window.devicePixelRatio,
|
||||
|
@ -911,6 +916,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
]);
|
||||
history.resumeRecording();
|
||||
this.setState({
|
||||
isLibraryOpen: false,
|
||||
selectedElementIds: newElements.reduce((map, element) => {
|
||||
map[element.id] = true;
|
||||
return map;
|
||||
|
@ -1355,6 +1361,10 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
return;
|
||||
}
|
||||
|
||||
if (event.code === "Digit9") {
|
||||
this.setState({ isLibraryOpen: !this.state.isLibraryOpen });
|
||||
}
|
||||
|
||||
const shape = findShapeByKey(event.key);
|
||||
|
||||
if (isArrowKey(event.key)) {
|
||||
|
@ -3135,6 +3145,18 @@ class App extends React.Component<ExcalidrawProps, AppState> {
|
|||
};
|
||||
|
||||
private handleCanvasOnDrop = (event: React.DragEvent<HTMLCanvasElement>) => {
|
||||
const libraryShapes = event.dataTransfer.getData(
|
||||
"application/vnd.excalidraw.json",
|
||||
);
|
||||
if (libraryShapes !== "") {
|
||||
this.addElementsFromPasteOrLibrary(
|
||||
JSON.parse(libraryShapes),
|
||||
event.clientX,
|
||||
event.clientY,
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
const file = event.dataTransfer?.files[0];
|
||||
if (
|
||||
file?.type === "application/json" ||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue