feat: More prominent keyboard shortcuts in hints (#10057)

* Initial

* Memoize

* Styling

* Use double angle brackets for keyboard shortcuts

* Use rem in gap

* Use an existing function for substituting tags in a string

* Revert styling

* Avoid unique key warnings

* Styling

* getTransChildren -> nodesFromTextWithTags

* Use height and padding instead of padding only

* Initial new idea

* WIP shortcut substitutions

* Use simple regex for parsing shortcuts

* Use single shortcut for combos

* Use kbd instead of span

* shortcutFromKeyString -> getTaggedShortcutKey

* Bug fix

* FlowChart -> Flowchart

* memo is useless here

* Trigger CI

* Translate in getShortcutKey

* More normalized shortcuts

* improve shortcut normalization and replacement & support multi-key tagged shortcuts

* fix regex

* tweak css

---------

Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
This commit is contained in:
Omar Brikaa
2025-10-20 16:09:20 +02:00
committed by GitHub
co-authored by dwelle
parent 725412ebd3
commit 8013eb5e16
19 changed files with 188 additions and 81 deletions
+32 -21
View File
@@ -337,33 +337,33 @@
"shapes": "Shapes"
},
"hints": {
"dismissSearch": "Escape to dismiss search",
"canvasPanning": "To move canvas, hold mouse wheel or spacebar while dragging, or use the hand tool",
"dismissSearch": "{{shortcut}} to dismiss search",
"canvasPanning": "To move canvas, hold mouse wheel or {{shortcut}} while dragging, or use the hand tool",
"linearElement": "Click to start multiple points, drag for single line",
"arrowTool": "Click to start multiple points, drag for single line. Press {{arrowShortcut}} again to change arrow type.",
"arrowTool": "Click to start multiple points, drag for single line. Press {{shortcut}} again to change arrow type.",
"freeDraw": "Click and drag, release when you're finished",
"text": "Tip: you can also add text by double-clicking anywhere with the selection tool",
"embeddable": "Click-drag to create a website embed",
"text_selected": "Double-click or press ENTER to edit text",
"text_editing": "Press Escape or CtrlOrCmd+ENTER to finish editing",
"linearElementMulti": "Click on last point or press Escape or Enter to finish",
"lockAngle": "You can constrain angle by holding SHIFT",
"resize": "You can constrain proportions by holding SHIFT while resizing,\nhold ALT to resize from the center",
"resizeImage": "You can resize freely by holding SHIFT,\nhold ALT to resize from the center",
"rotate": "You can constrain angles by holding SHIFT while rotating",
"lineEditor_info": "Hold CtrlOrCmd and Double-click or press CtrlOrCmd + Enter to edit points",
"lineEditor_line_info": "Double-click or press Enter to edit points",
"lineEditor_pointSelected": "Press Delete to remove point(s),\nCtrlOrCmd+D to duplicate, or drag to move",
"lineEditor_nothingSelected": "Select a point to edit (hold SHIFT to select multiple),\nor hold Alt and click to add new points",
"text_selected": "Double-click or press {{shortcut}} to edit text",
"text_editing": "Press {{shortcut_1}} or {{shortcut_2}} to finish editing",
"linearElementMulti": "Click on last point or press {{shortcut_1}} or {{shortcut_2}} to finish",
"lockAngle": "You can constrain angle by holding {{shortcut}}",
"resize": "You can constrain proportions by holding {{shortcut_1}} while resizing,\nhold {{shortcut_2}} to resize from the center",
"resizeImage": "You can resize freely by holding {{shortcut_1}},\nhold {{shortcut_2}} to resize from the center",
"rotate": "You can constrain angles by holding {{shortcut}} while rotating",
"lineEditor_info": "Hold {{shortcut_1}} and Double-click or press {{shortcut_2}} to edit points",
"lineEditor_line_info": "Double-click or press {{shortcut}} to edit points",
"lineEditor_pointSelected": "Press {{shortcut_1}} to remove point(s),\n{{shortcut_2}} to duplicate, or drag to move",
"lineEditor_nothingSelected": "Select a point to edit (hold {{shortcut_1}} to select multiple),\nor hold {{shortcut_2}} and click to add new points",
"publishLibrary": "Publish your own library",
"bindTextToElement": "Press enter to add text",
"createFlowchart": "Hold CtrlOrCmd and Arrow key to create a flowchart",
"deepBoxSelect": "Hold CtrlOrCmd to deep select, and to prevent dragging",
"eraserRevert": "Hold Alt to revert the elements marked for deletion",
"bindTextToElement": "Press {{shortcut}} to add text",
"createFlowchart": "Hold {{shortcut}} and Arrow key to create a flowchart",
"deepBoxSelect": "Hold {{shortcut}} to deep select, and to prevent dragging",
"eraserRevert": "Hold {{shortcut}} to revert the elements marked for deletion",
"firefox_clipboard_write": "This feature can likely be enabled by setting the \"dom.events.asyncClipboard.clipboardItem\" flag to \"true\". To change the browser flags in Firefox, visit the \"about:config\" page.",
"disableSnapping": "Hold CtrlOrCmd to disable snapping",
"enterCropEditor": "Double click the image or press ENTER to crop the image",
"leaveCropEditor": "Click outside the image or press ENTER or ESCAPE to finish cropping"
"disableSnapping": "Hold {{shortcut}} to disable snapping",
"enterCropEditor": "Double click the image or press {{shortcut}} to crop the image",
"leaveCropEditor": "Click outside the image or press {{shortcut_1}} or {{shortcut_2}} to finish cropping"
},
"canvasError": {
"cannotShowPreview": "Cannot show preview",
@@ -648,5 +648,16 @@
},
"itemNotAvailable": "Command is not available...",
"shortcutHint": "For Command palette, use {{shortcut}}"
},
"keys": {
"ctrl": "Ctrl",
"option": "Option",
"cmd": "Cmd",
"alt": "Alt",
"escape": "Esc",
"enter": "Enter",
"shift": "Shift",
"spacebar": "Space",
"delete": "Delete"
}
}