diff --git a/src/index.tsx b/src/index.tsx index 0e4aadc2..addd06b5 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -659,6 +659,9 @@ function getSelectedIndices() { return selectedIndices; } +const someElementIsSelected = () => + elements.some(element => element.isSelected); + const ELEMENT_SHIFT_TRANSLATE_AMOUNT = 5; const ELEMENT_TRANSLATE_AMOUNT = 1; @@ -730,14 +733,12 @@ class App extends React.Component<{}, AppState> { event.altKey && event.code === "KeyB" ) { - moveOneLeft(elements, getSelectedIndices()); - this.forceUpdate(); + this.moveOneLeft(); event.preventDefault(); // Send to back: Cmd-Shift-B } else if (event.metaKey && event.shiftKey && event.code === "KeyB") { - moveAllLeft(elements, getSelectedIndices()); - this.forceUpdate(); + this.moveAllLeft(); event.preventDefault(); // Select all: Cmd-A @@ -752,6 +753,21 @@ class App extends React.Component<{}, AppState> { } }; + private deleteSelectedElements = () => { + deleteSelectedElements(); + this.forceUpdate(); + }; + + private moveAllLeft = () => { + moveAllLeft(elements, getSelectedIndices()); + this.forceUpdate(); + }; + + private moveOneLeft = () => { + moveOneLeft(elements, getSelectedIndices()); + this.forceUpdate(); + }; + public render() { return (
{ px)
+ {someElementIsSelected() && ( + <> +

Shape options

+
+ + + + +
+ + )} { clearSelection(); } - isDraggingElements = elements.some(element => element.isSelected); + isDraggingElements = someElementIsSelected(); if (isDraggingElements) { document.documentElement.style.cursor = "move";