Reset selectedElementIds when deleting selected elements (#875)

src/actions/actionDeleteSelected.tsx

@@ -9,9 +9,17 @@ import { register } from "./register";
 export const actionDeleteSelected = register({
   name: "deleteSelectedElements",
   perform: (elements, appState) => {
+    const {
+      elements: nextElements,
+      appState: nextAppState,
+    } = deleteSelectedElements(elements, appState);
     return {
-      elements: deleteSelectedElements(elements, appState),
+      elements: nextElements,
-      appState: { ...appState, elementType: "selection", multiElement: null },
+      appState: {
+        ...nextAppState,
+        elementType: "selection",
+        multiElement: null,
+      },
     };
   },
   contextItemLabel: "labels.delete",

src/components/App.tsx

@@ -180,9 +180,13 @@ export class App extends React.Component<any, AppState> {
       return;
     }
     copyToAppClipboard(elements, this.state);
-    elements = deleteSelectedElements(elements, this.state);
+    const { elements: nextElements, appState } = deleteSelectedElements(
+      elements,
+      this.state,
+    );
+    elements = nextElements;
     history.resumeRecording();
-    this.setState({});
+    this.setState({ ...appState });
     event.preventDefault();
   };
   private onCopy = (event: ClipboardEvent) => {

src/scene/selection.ts

@@ -34,7 +34,13 @@ export function deleteSelectedElements(
   elements: readonly ExcalidrawElement[],
   appState: AppState,
 ) {
-  return elements.filter(el => !appState.selectedElementIds[el.id]);
+  return {
+    elements: elements.filter(el => !appState.selectedElementIds[el.id]),
+    appState: {
+      ...appState,
+      selectedElementIds: {},
+    },
+  };
 }
 
 export function getSelectedIndices(