Absorb the matrix-react-sdk repository (#28192)

Co-authored-by: github-merge-queue <118344674+github-merge-queue@users.noreply.github.com> Co-authored-by: github-merge-queue <github-merge-queue@users.noreply.github.com> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Florian Duros <florian.duros@ormaz.fr> Co-authored-by: Kim Brose <kim.brose@nordeck.net> Co-authored-by: Florian Duros <florianduros@element.io> Co-authored-by: R Midhun Suresh <hi@midhun.dev> Co-authored-by: dbkr <986903+dbkr@users.noreply.github.com> Co-authored-by: ElementRobot <releases@riot.im> Co-authored-by: dbkr <dbkr@users.noreply.github.com> Co-authored-by: David Baker <dbkr@users.noreply.github.com> Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> Co-authored-by: David Langley <davidl@element.io> Co-authored-by: Michael Weimann <michaelw@matrix.org> Co-authored-by: Timshel <Timshel@users.noreply.github.com> Co-authored-by: Sahil Silare <32628578+sahil9001@users.noreply.github.com> Co-authored-by: Will Hunt <will@half-shot.uk> Co-authored-by: Hubert Chathi <hubert@uhoreg.ca> Co-authored-by: Andrew Ferrazzutti <andrewf@element.io> Co-authored-by: Robin <robin@robin.town> Co-authored-by: Tulir Asokan <tulir@maunium.net>
2024-10-16 13:31:55 +01:00
parent 2b99496025
commit c05c429803
3280 changed files with 586617 additions and 905 deletions
--- a/docs/features/keyboardShortcuts.md
+++ b/docs/features/keyboardShortcuts.md
@@ -0,0 +1,59 @@
+# Keyboard shortcuts
+
+## Using the `KeyBindingManager`
+
+The `KeyBindingManager` (accessible using `getKeyBindingManager()`) is a class
+with several methods that allow you to get a `KeyBindingAction` based on a
+`KeyboardEvent | React.KeyboardEvent`.
+
+The event passed to the `KeyBindingManager` gets compared to the list of
+shortcuts that are retrieved from the `IKeyBindingsProvider`s. The
+`IKeyBindingsProvider` is in `KeyBindingDefaults`.
+
+### Examples
+
+Let's say we want to close a menu when the correct keys were pressed:
+
+```ts
+const onKeyDown = (ev: KeyboardEvent): void => {
+    let handled = true;
+    const action = getKeyBindingManager().getAccessibilityAction(ev);
+    switch (action) {
+        case KeyBindingAction.Escape:
+            closeMenu();
+            break;
+        default:
+            handled = false;
+            break;
+    }
+
+    if (handled) {
+        ev.preventDefault();
+        ev.stopPropagation();
+    }
+};
+```
+
+## Managing keyboard shortcuts
+
+There are a few things at play when it comes to keyboard shortcuts. The
+`KeyBindingManager` gets `IKeyBindingsProvider`s one of which is
+`defaultBindingsProvider` defined in `KeyBindingDefaults`. In
+`KeyBindingDefaults` a `getBindingsByCategory()` method is used to create
+`KeyBinding`s based on `KeyboardShortcutSetting`s defined in
+`KeyboardShortcuts`.
+
+### Adding keyboard shortcuts
+
+To add a keyboard shortcut there are two files we have to look at:
+`KeyboardShortcuts.ts` and `KeyBindingDefaults.ts`. In most cases we only need
+to edit `KeyboardShortcuts.ts`: add a `KeyBindingAction` and add the
+`KeyBindingAction` to the `KEYBOARD_SHORTCUTS` object.
+
+Though, to make matters worse, sometimes we want to add a shortcut that has
+multiple keybindings associated with. This keyboard shortcut won't be
+customizable as it would be rather difficult to manage both from the point of
+the settings and the UI. To do this, we have to add a `KeyBindingAction` and add
+the UI representation of that keyboard shortcut to the `getUIOnlyShortcuts()`
+method. Then, we also need to add the keybinding to the correct method in
+`KeyBindingDefaults`.