diff --git a/src/element/index.ts b/src/element/index.ts index 0e8aac4a37..ffcaeb40c6 100644 --- a/src/element/index.ts +++ b/src/element/index.ts @@ -12,3 +12,4 @@ export { resizeTest } from "./resizeTest"; export { isTextElement } from "./typeChecks"; export { textWysiwyg } from "./textWysiwyg"; export { redrawTextBoundingBox } from "./textElement"; +export { isInvisiblySmallElement } from "./sizeChecks"; diff --git a/src/element/sizeChecks.ts b/src/element/sizeChecks.ts new file mode 100644 index 0000000000..01cf92092f --- /dev/null +++ b/src/element/sizeChecks.ts @@ -0,0 +1,5 @@ +import { ExcalidrawElement } from "./types"; + +export function isInvisiblySmallElement(element: ExcalidrawElement): boolean { + return element.width === 0 && element.height === 0; +} diff --git a/src/index.tsx b/src/index.tsx index 05231dd29a..f901931577 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -8,6 +8,7 @@ import { newElement, duplicateElement, resizeTest, + isInvisiblySmallElement, isTextElement, textWysiwyg, getElementAbsoluteCoords @@ -978,7 +979,11 @@ export class App extends React.Component<{}, AppState> { }; const onMouseUp = (e: MouseEvent) => { - const { draggingElement, elementType } = this.state; + const { + draggingElement, + resizingElement, + elementType + } = this.state; lastMouseUp = null; window.removeEventListener("mousemove", onMouseMove); @@ -987,8 +992,7 @@ export class App extends React.Component<{}, AppState> { if ( elementType !== "selection" && draggingElement && - draggingElement.width === 0 && - draggingElement.height === 0 + isInvisiblySmallElement(draggingElement) ) { // remove invisible element which was added in onMouseDown elements = elements.slice(0, -1); @@ -999,6 +1003,10 @@ export class App extends React.Component<{}, AppState> { return; } + if (resizingElement && isInvisiblySmallElement(resizingElement)) { + elements = elements.filter(el => el.id !== resizingElement.id); + } + resetCursor(); // If click occured on already selected element