github-forks
/
success
mirror of https://github.com/excalidraw/excalidraw.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: Map shortcut O to ellipse and Add eraser shortcut E (#4930)

Browse Source 
* feat: Add erase shortcut Shift+E

* map o to ellipse and E to Eraser

* fix tests

* use key

* move eraser to tools and rename shape to tools
pull/4932/head
Aakansha Doshi 3 years ago committed by GitHub
parent fb32886355
commit 1cfb4dfd8b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 67 additions and 62 deletions
Show Stats Download Patch File Download Diff File

3
src/actions/actionCanvas.tsx
Unescape Escape View File

@ -304,12 +304,13 @@ export const actionErase = register({
commitToHistory: true, commitToHistory: true,
}; };
}, },
keyTest: (event) => event.key === KEYS.E,
PanelComponent: ({ elements, appState, updateData, data }) => ( PanelComponent: ({ elements, appState, updateData, data }) => (
<ToolButton <ToolButton
type="button" type="button"
icon={eraser} icon={eraser}
className={clsx("eraser", { active: isEraserActive(appState) })} className={clsx("eraser", { active: isEraserActive(appState) })}
title={t("toolBar.eraser")} title={`${t("toolBar.eraser")}-${getShortcutKey("E")}`}
aria-label={t("toolBar.eraser")} aria-label={t("toolBar.eraser")}
onClick={() => { onClick={() => {
updateData(null); updateData(null);

8
src/components/HelpDialog.tsx
Unescape Escape View File

@ -139,7 +139,7 @@ export const HelpDialog = ({ onClose }: { onClose?: () => void }) => {
<Section title={t("helpDialog.shortcuts")}> <Section title={t("helpDialog.shortcuts")}>
<Columns> <Columns>
<Column> <Column>
<ShortcutIsland caption={t("helpDialog.shapes")}> <ShortcutIsland caption={t("helpDialog.tools")}>
<Shortcut <Shortcut
label={t("toolBar.selection")} label={t("toolBar.selection")}
shortcuts={["V", "1"]} shortcuts={["V", "1"]}
@ -149,7 +149,7 @@ export const HelpDialog = ({ onClose }: { onClose?: () => void }) => {
shortcuts={["R", "2"]} shortcuts={["R", "2"]}
/> />
<Shortcut label={t("toolBar.diamond")} shortcuts={["D", "3"]} /> <Shortcut label={t("toolBar.diamond")} shortcuts={["D", "3"]} />
<Shortcut label={t("toolBar.ellipse")} shortcuts={["E", "4"]} /> <Shortcut label={t("toolBar.ellipse")} shortcuts={["O", "4"]} />
<Shortcut label={t("toolBar.arrow")} shortcuts={["A", "5"]} /> <Shortcut label={t("toolBar.arrow")} shortcuts={["A", "5"]} />
<Shortcut label={t("toolBar.line")} shortcuts={["P", "6"]} /> <Shortcut label={t("toolBar.line")} shortcuts={["P", "6"]} />
<Shortcut <Shortcut
@ -159,6 +159,10 @@ export const HelpDialog = ({ onClose }: { onClose?: () => void }) => {
<Shortcut label={t("toolBar.text")} shortcuts={["T", "8"]} /> <Shortcut label={t("toolBar.text")} shortcuts={["T", "8"]} />
<Shortcut label={t("toolBar.image")} shortcuts={["9"]} /> <Shortcut label={t("toolBar.image")} shortcuts={["9"]} />
<Shortcut label={t("toolBar.library")} shortcuts={["0"]} /> <Shortcut label={t("toolBar.library")} shortcuts={["0"]} />
<Shortcut
label={t("toolBar.eraser")}
shortcuts={[getShortcutKey("E")]}
/>
<Shortcut <Shortcut
label={t("helpDialog.editSelectedShape")} label={t("helpDialog.editSelectedShape")}
shortcuts={[ shortcuts={[

2
src/locales/en.json
Unescape Escape View File

@ -283,7 +283,7 @@
"howto": "Follow our guides", "howto": "Follow our guides",
"or": "or", "or": "or",
"preventBinding": "Prevent arrow binding", "preventBinding": "Prevent arrow binding",
"shapes": "Shapes", "tools": "Tools",
"shortcuts": "Keyboard shortcuts", "shortcuts": "Keyboard shortcuts",
"textFinish": "Finish editing (text editor)", "textFinish": "Finish editing (text editor)",
"textNewLine": "Add new line (text editor)", "textNewLine": "Add new line (text editor)",

2
src/shapes.tsx
Unescape Escape View File

@ -40,7 +40,7 @@ export const SHAPES = [
</svg> </svg>
), ),
value: "ellipse", value: "ellipse",
key: KEYS.E, key: KEYS.O,
}, },
{ {
icon: ( icon: (

112
src/tests/__snapshots__/regressionTests.test.tsx.snap
Unescape Escape View File

@ -11510,7 +11510,7 @@ exports[`regression tests key d selects diamond tool: [end of test] number of el
exports[`regression tests key d selects diamond tool: [end of test] number of renders 1`] = `8`; exports[`regression tests key d selects diamond tool: [end of test] number of renders 1`] = `8`;
exports[`regression tests key e selects ellipse tool: [end of test] appState 1`] = ` exports[`regression tests key l selects line tool: [end of test] appState 1`] = `
Object { Object {
"collaborators": Map {}, "collaborators": Map {},
"currentChartType": "bar", "currentChartType": "bar",
@ -11590,35 +11590,50 @@ Object {
} }
`; `;
exports[`regression tests key e selects ellipse tool: [end of test] element 0 1`] = ` exports[`regression tests key l selects line tool: [end of test] element 0 1`] = `
Object { Object {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"endArrowhead": null,
"endBinding": null,
"fillStyle": "hachure", "fillStyle": "hachure",
"groupIds": Array [], "groupIds": Array [],
"height": 10, "height": 10,
"id": "id0", "id": "id0",
"isDeleted": false, "isDeleted": false,
"lastCommittedPoint": null,
"link": null, "link": null,
"opacity": 100, "opacity": 100,
"points": Array [
Array [
0,
0,
],
Array [
10,
10,
],
],
"roughness": 1, "roughness": 1,
"seed": 337897, "seed": 337897,
"startArrowhead": null,
"startBinding": null,
"strokeColor": "#000000", "strokeColor": "#000000",
"strokeSharpness": "sharp", "strokeSharpness": "round",
"strokeStyle": "solid", "strokeStyle": "solid",
"strokeWidth": 1, "strokeWidth": 1,
"type": "ellipse", "type": "line",
"updated": 1, "updated": 1,
"version": 2, "version": 3,
"versionNonce": 1278240551, "versionNonce": 449462985,
"width": 10, "width": 10,
"x": 10, "x": 10,
"y": 10, "y": 10,
} }
`; `;
exports[`regression tests key e selects ellipse tool: [end of test] history 1`] = ` exports[`regression tests key l selects line tool: [end of test] history 1`] = `
Object { Object {
"recording": false, "recording": false,
"redoStack": Array [], "redoStack": Array [],
@ -11650,23 +11665,38 @@ Object {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"endArrowhead": null,
"endBinding": null,
"fillStyle": "hachure", "fillStyle": "hachure",
"groupIds": Array [], "groupIds": Array [],
"height": 10, "height": 10,
"id": "id0", "id": "id0",
"isDeleted": false, "isDeleted": false,
"lastCommittedPoint": null,
"link": null, "link": null,
"opacity": 100, "opacity": 100,
"points": Array [
Array [
0,
0,
],
Array [
10,
10,
],
],
"roughness": 1, "roughness": 1,
"seed": 337897, "seed": 337897,
"startArrowhead": null,
"startBinding": null,
"strokeColor": "#000000", "strokeColor": "#000000",
"strokeSharpness": "sharp", "strokeSharpness": "round",
"strokeStyle": "solid", "strokeStyle": "solid",
"strokeWidth": 1, "strokeWidth": 1,
"type": "ellipse", "type": "line",
"updated": 1, "updated": 1,
"version": 2, "version": 3,
"versionNonce": 1278240551, "versionNonce": 449462985,
"width": 10, "width": 10,
"x": 10, "x": 10,
"y": 10, "y": 10,
@ -11677,11 +11707,11 @@ Object {
} }
`; `;
exports[`regression tests key e selects ellipse tool: [end of test] number of elements 1`] = `1`; exports[`regression tests key l selects line tool: [end of test] number of elements 1`] = `1`;
exports[`regression tests key e selects ellipse tool: [end of test] number of renders 1`] = `8`; exports[`regression tests key l selects line tool: [end of test] number of renders 1`] = `8`;
exports[`regression tests key l selects line tool: [end of test] appState 1`] = ` exports[`regression tests key o selects ellipse tool: [end of test] appState 1`] = `
Object { Object {
"collaborators": Map {}, "collaborators": Map {},
"currentChartType": "bar", "currentChartType": "bar",
@ -11761,50 +11791,35 @@ Object {
} }
`; `;
exports[`regression tests key l selects line tool: [end of test] element 0 1`] = ` exports[`regression tests key o selects ellipse tool: [end of test] element 0 1`] = `
Object { Object {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"endArrowhead": null,
"endBinding": null,
"fillStyle": "hachure", "fillStyle": "hachure",
"groupIds": Array [], "groupIds": Array [],
"height": 10, "height": 10,
"id": "id0", "id": "id0",
"isDeleted": false, "isDeleted": false,
"lastCommittedPoint": null,
"link": null, "link": null,
"opacity": 100, "opacity": 100,
"points": Array [
Array [
0,
0,
],
Array [
10,
10,
],
],
"roughness": 1, "roughness": 1,
"seed": 337897, "seed": 337897,
"startArrowhead": null,
"startBinding": null,
"strokeColor": "#000000", "strokeColor": "#000000",
"strokeSharpness": "round", "strokeSharpness": "sharp",
"strokeStyle": "solid", "strokeStyle": "solid",
"strokeWidth": 1, "strokeWidth": 1,
"type": "line", "type": "ellipse",
"updated": 1, "updated": 1,
"version": 3, "version": 2,
"versionNonce": 449462985, "versionNonce": 1278240551,
"width": 10, "width": 10,
"x": 10, "x": 10,
"y": 10, "y": 10,
} }
`; `;
exports[`regression tests key l selects line tool: [end of test] history 1`] = ` exports[`regression tests key o selects ellipse tool: [end of test] history 1`] = `
Object { Object {
"recording": false, "recording": false,
"redoStack": Array [], "redoStack": Array [],
@ -11836,38 +11851,23 @@ Object {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"endArrowhead": null,
"endBinding": null,
"fillStyle": "hachure", "fillStyle": "hachure",
"groupIds": Array [], "groupIds": Array [],
"height": 10, "height": 10,
"id": "id0", "id": "id0",
"isDeleted": false, "isDeleted": false,
"lastCommittedPoint": null,
"link": null, "link": null,
"opacity": 100, "opacity": 100,
"points": Array [
Array [
0,
0,
],
Array [
10,
10,
],
],
"roughness": 1, "roughness": 1,
"seed": 337897, "seed": 337897,
"startArrowhead": null,
"startBinding": null,
"strokeColor": "#000000", "strokeColor": "#000000",
"strokeSharpness": "round", "strokeSharpness": "sharp",
"strokeStyle": "solid", "strokeStyle": "solid",
"strokeWidth": 1, "strokeWidth": 1,
"type": "line", "type": "ellipse",
"updated": 1, "updated": 1,
"version": 3, "version": 2,
"versionNonce": 449462985, "versionNonce": 1278240551,
"width": 10, "width": 10,
"x": 10, "x": 10,
"y": 10, "y": 10,
@ -11878,9 +11878,9 @@ Object {
} }
`; `;
exports[`regression tests key l selects line tool: [end of test] number of elements 1`] = `1`; exports[`regression tests key o selects ellipse tool: [end of test] number of elements 1`] = `1`;
exports[`regression tests key l selects line tool: [end of test] number of renders 1`] = `8`; exports[`regression tests key o selects ellipse tool: [end of test] number of renders 1`] = `8`;
exports[`regression tests key r selects rectangle tool: [end of test] appState 1`] = ` exports[`regression tests key r selects rectangle tool: [end of test] appState 1`] = `
Object { Object {

2
src/tests/regressionTests.test.tsx
Unescape Escape View File

@ -135,7 +135,7 @@ describe("regression tests", () => {
for (const [keys, shape, shouldSelect] of [ for (const [keys, shape, shouldSelect] of [
[`2${KEYS.R}`, "rectangle", true], [`2${KEYS.R}`, "rectangle", true],
[`3${KEYS.D}`, "diamond", true], [`3${KEYS.D}`, "diamond", true],
[`4${KEYS.E}`, "ellipse", true], [`4${KEYS.O}`, "ellipse", true],
[`5${KEYS.A}`, "arrow", true], [`5${KEYS.A}`, "arrow", true],
[`6${KEYS.L}`, "line", true], [`6${KEYS.L}`, "line", true],
[`7${KEYS.X}`, "freedraw", false], [`7${KEYS.X}`, "freedraw", false],

Write Preview
Loading…
Cancel
Save