mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
Add more ESLint rules and change the formatting scripts (#626)
* Add curly rule in ESLint for consistency * Fix rules * More rules * REturn * Push * no else return * prefer const * destructing
This commit is contained in:
Lipis
GitHub
parent
814299321e
commit
53994e71e5
21 changed files with 201 additions and 77 deletions
|
|
@ -221,7 +221,9 @@ export class App extends React.Component<any, AppState> {
|
|||
};
|
||||
|
||||
private onCut = (e: ClipboardEvent) => {
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) return;
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) {
|
||||
return;
|
||||
}
|
||||
e.clipboardData?.setData(
|
||||
"text/plain",
|
||||
JSON.stringify(
|
||||
|
|
@ -235,7 +237,9 @@ export class App extends React.Component<any, AppState> {
|
|||
e.preventDefault();
|
||||
};
|
||||
private onCopy = (e: ClipboardEvent) => {
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) return;
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) {
|
||||
return;
|
||||
}
|
||||
e.clipboardData?.setData(
|
||||
"text/plain",
|
||||
JSON.stringify(
|
||||
|
|
@ -247,7 +251,9 @@ export class App extends React.Component<any, AppState> {
|
|||
e.preventDefault();
|
||||
};
|
||||
private onPaste = (e: ClipboardEvent) => {
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) return;
|
||||
if (isInputLike(e.target) && !isToolIcon(e.target)) {
|
||||
return;
|
||||
}
|
||||
const paste = e.clipboardData?.getData("text") || "";
|
||||
this.addElementsFromPaste(paste);
|
||||
e.preventDefault();
|
||||
|
|
@ -339,7 +345,9 @@ export class App extends React.Component<any, AppState> {
|
|||
};
|
||||
|
||||
private onKeyDown = (event: KeyboardEvent) => {
|
||||
if (isInputLike(event.target) && event.key !== KEYS.ESCAPE) return;
|
||||
if (isInputLike(event.target) && event.key !== KEYS.ESCAPE) {
|
||||
return;
|
||||
}
|
||||
|
||||
const actionResult = this.actionManager.handleKeyDown(
|
||||
event,
|
||||
|
|
@ -349,7 +357,9 @@ export class App extends React.Component<any, AppState> {
|
|||
|
||||
if (actionResult) {
|
||||
this.syncActionResult(actionResult);
|
||||
if (actionResult) return;
|
||||
if (actionResult) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
const shape = findShapeByKey(event.key);
|
||||
|
|
@ -361,10 +371,15 @@ export class App extends React.Component<any, AppState> {
|
|||
elements = elements.map(el => {
|
||||
if (el.isSelected) {
|
||||
const element = { ...el };
|
||||
if (event.key === KEYS.ARROW_LEFT) element.x -= step;
|
||||
else if (event.key === KEYS.ARROW_RIGHT) element.x += step;
|
||||
else if (event.key === KEYS.ARROW_UP) element.y -= step;
|
||||
else if (event.key === KEYS.ARROW_DOWN) element.y += step;
|
||||
if (event.key === KEYS.ARROW_LEFT) {
|
||||
element.x -= step;
|
||||
} else if (event.key === KEYS.ARROW_RIGHT) {
|
||||
element.x += step;
|
||||
} else if (event.key === KEYS.ARROW_UP) {
|
||||
element.y -= step;
|
||||
} else if (event.key === KEYS.ARROW_DOWN) {
|
||||
element.y += step;
|
||||
}
|
||||
return element;
|
||||
}
|
||||
return el;
|
||||
|
|
@ -602,13 +617,14 @@ export class App extends React.Component<any, AppState> {
|
|||
actionManager={this.actionManager}
|
||||
syncActionResult={this.syncActionResult}
|
||||
onExportToPng={(exportedElements, scale) => {
|
||||
if (this.canvas)
|
||||
if (this.canvas) {
|
||||
exportCanvas("png", exportedElements, this.canvas, {
|
||||
exportBackground: this.state.exportBackground,
|
||||
name: this.state.name,
|
||||
viewBackgroundColor: this.state.viewBackgroundColor,
|
||||
scale,
|
||||
});
|
||||
}
|
||||
}}
|
||||
onExportToSvg={(exportedElements, scale) => {
|
||||
if (this.canvas) {
|
||||
|
|
@ -621,16 +637,17 @@ export class App extends React.Component<any, AppState> {
|
|||
}
|
||||
}}
|
||||
onExportToClipboard={(exportedElements, scale) => {
|
||||
if (this.canvas)
|
||||
if (this.canvas) {
|
||||
exportCanvas("clipboard", exportedElements, this.canvas, {
|
||||
exportBackground: this.state.exportBackground,
|
||||
name: this.state.name,
|
||||
viewBackgroundColor: this.state.viewBackgroundColor,
|
||||
scale,
|
||||
});
|
||||
}
|
||||
}}
|
||||
onExportToBackend={exportedElements => {
|
||||
if (this.canvas)
|
||||
if (this.canvas) {
|
||||
exportCanvas(
|
||||
"backend",
|
||||
exportedElements.map(element => ({
|
||||
|
|
@ -640,6 +657,7 @@ export class App extends React.Component<any, AppState> {
|
|||
this.canvas,
|
||||
this.state,
|
||||
);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
{this.actionManager.renderAction(
|
||||
|
|
@ -813,7 +831,9 @@ export class App extends React.Component<any, AppState> {
|
|||
lastMouseUp(e);
|
||||
}
|
||||
|
||||
if (isPanning) return;
|
||||
if (isPanning) {
|
||||
return;
|
||||
}
|
||||
|
||||
// pan canvas on wheel button drag or space+drag
|
||||
if (
|
||||
|
|
@ -826,8 +846,8 @@ export class App extends React.Component<any, AppState> {
|
|||
document.documentElement.style.cursor = CURSOR_TYPE.GRABBING;
|
||||
let { clientX: lastX, clientY: lastY } = e;
|
||||
const onMouseMove = (e: MouseEvent) => {
|
||||
let deltaX = lastX - e.clientX;
|
||||
let deltaY = lastY - e.clientY;
|
||||
const deltaX = lastX - e.clientX;
|
||||
const deltaY = lastY - e.clientY;
|
||||
lastX = e.clientX;
|
||||
lastY = e.clientY;
|
||||
// We don't want to save history when panning around
|
||||
|
|
@ -857,7 +877,9 @@ export class App extends React.Component<any, AppState> {
|
|||
}
|
||||
|
||||
// only handle left mouse button
|
||||
if (e.button !== MOUSE_BUTTON.MAIN) return;
|
||||
if (e.button !== MOUSE_BUTTON.MAIN) {
|
||||
return;
|
||||
}
|
||||
// fixes mousemove causing selection of UI texts #32
|
||||
e.preventDefault();
|
||||
// Preventing the event above disables default behavior
|
||||
|
|
@ -1080,7 +1102,7 @@ export class App extends React.Component<any, AppState> {
|
|||
const absPx = p1[0] + element.x;
|
||||
const absPy = p1[1] + element.y;
|
||||
|
||||
let { width, height } = getPerfectElementSize(
|
||||
const { width, height } = getPerfectElementSize(
|
||||
"arrow",
|
||||
mouseX - element.x - p1[0],
|
||||
mouseY - element.y - p1[1],
|
||||
|
|
@ -1155,8 +1177,9 @@ export class App extends React.Component<any, AppState> {
|
|||
// triggering mousemove)
|
||||
if (!draggingOccurred && this.state.elementType === "arrow") {
|
||||
const { x, y } = viewportCoordsToSceneCoords(e, this.state);
|
||||
if (distance2d(x, y, originX, originY) < DRAGGING_THRESHOLD)
|
||||
if (distance2d(x, y, originX, originY) < DRAGGING_THRESHOLD) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (isResizingElements && this.state.resizingElement) {
|
||||
|
|
@ -1432,7 +1455,9 @@ export class App extends React.Component<any, AppState> {
|
|||
// It is very important to read this.state within each move event,
|
||||
// otherwise we would read a stale one!
|
||||
const draggingElement = this.state.draggingElement;
|
||||
if (!draggingElement) return;
|
||||
if (!draggingElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { x, y } = viewportCoordsToSceneCoords(e, this.state);
|
||||
|
||||
|
|
@ -1443,8 +1468,12 @@ export class App extends React.Component<any, AppState> {
|
|||
this.state.elementType === "line" ||
|
||||
this.state.elementType === "arrow";
|
||||
|
||||
if (isLinear && x < originX) width = -width;
|
||||
if (isLinear && y < originY) height = -height;
|
||||
if (isLinear && x < originX) {
|
||||
width = -width;
|
||||
}
|
||||
if (isLinear && y < originY) {
|
||||
height = -height;
|
||||
}
|
||||
|
||||
if (e.shiftKey) {
|
||||
({ width, height } = getPerfectElementSize(
|
||||
|
|
@ -1453,7 +1482,9 @@ export class App extends React.Component<any, AppState> {
|
|||
!isLinear && y < originY ? -height : height,
|
||||
));
|
||||
|
||||
if (!isLinear && height < 0) height = -height;
|
||||
if (!isLinear && height < 0) {
|
||||
height = -height;
|
||||
}
|
||||
}
|
||||
|
||||
if (!isLinear) {
|
||||
|
|
@ -1724,7 +1755,9 @@ export class App extends React.Component<any, AppState> {
|
|||
});
|
||||
}}
|
||||
onMouseMove={e => {
|
||||
if (isHoldingSpace || isPanning) return;
|
||||
if (isHoldingSpace || isPanning) {
|
||||
return;
|
||||
}
|
||||
const hasDeselectedButton = Boolean(e.buttons);
|
||||
if (
|
||||
hasDeselectedButton ||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue