summaryrefslogtreecommitdiffstats
path: root/browser/components/aboutlogins/content/utils
diff options
context:
space:
mode:
Diffstat (limited to 'browser/components/aboutlogins/content/utils')
-rw-r--r--browser/components/aboutlogins/content/utils/controllers.mjs18
-rw-r--r--browser/components/aboutlogins/content/utils/keypress.mjs42
2 files changed, 60 insertions, 0 deletions
diff --git a/browser/components/aboutlogins/content/utils/controllers.mjs b/browser/components/aboutlogins/content/utils/controllers.mjs
new file mode 100644
index 0000000000..13c46dfcaf
--- /dev/null
+++ b/browser/components/aboutlogins/content/utils/controllers.mjs
@@ -0,0 +1,18 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// Simple controller wrapper that binds a controller and runs cleanup function
+// https://lit.dev/docs/composition/controllers/
+export const withSimpleController = (host, functionToBind, ...args) =>
+ class {
+ constructor() {
+ host.addController(this);
+ }
+ hostConnected() {
+ this.cleanup = functionToBind?.(host, ...args);
+ }
+ hostDisconnected() {
+ this.cleanup?.();
+ }
+ };
diff --git a/browser/components/aboutlogins/content/utils/keypress.mjs b/browser/components/aboutlogins/content/utils/keypress.mjs
new file mode 100644
index 0000000000..13a97964c0
--- /dev/null
+++ b/browser/components/aboutlogins/content/utils/keypress.mjs
@@ -0,0 +1,42 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import { withSimpleController } from "./controllers.mjs";
+
+const useKeyEvent =
+ keyEventName => (target, keyCombination, callback, options) => {
+ const parts = keyCombination.split("+");
+ const keys = parts.map(part => part.toLowerCase());
+ const modifiers = ["ctrl", "alt", "shift", "meta"];
+
+ const handleKeyEvent = event => {
+ const isModifierCorrect = modifiers.every(
+ modifier => keys.includes(modifier) === event[`${modifier}Key`]
+ );
+
+ const actualKey = keys.find(key => !modifiers.includes(key));
+
+ // We check the code value rather than key since key value
+ // can be missleading without prevent default e.g. option + N = ñ
+ const isKeyCorrect =
+ event.code.toLowerCase() === `key${actualKey}`.toLowerCase() ||
+ event.code.toLowerCase() === actualKey.toLowerCase();
+
+ if (isModifierCorrect && isKeyCorrect) {
+ if (options?.preventDefault) {
+ event.preventDefault();
+ }
+ callback?.(event);
+ }
+ };
+
+ target.addEventListener(keyEventName, handleKeyEvent);
+
+ return () => {
+ target.removeEventListener(keyEventName, handleKeyEvent);
+ };
+ };
+
+export const handleKeyPress = (host, ...args) =>
+ new (withSimpleController(host, useKeyEvent("keydown"), ...args))();