✨ ags(background-window): listen for Escape key, rename onClick to onAction

ags/widget/BackgroundWindow.ts

@@ -11,12 +11,13 @@ export type BackgroundWindowProps = {
     monitor: number | Binding<number | undefined>;
     /** Custom stylesheet used in the window. default: `background: rgba(0, 0, 0, .2)` */
     css?: string | Binding<string | undefined>;
-    /** Function that is called when the user clicks on the window (any mouse button) */
+    /** Function that is called when the user triggers a mouse-click or escape action on the window */
-    onClick?: (window: Widget.Window) => void;
+    onAction?: (window: Widget.Window) => void;
     /** Function that is called when the user clicks on the window with primary mouse button */
     onClickPrimary?: (window: Widget.Window) => void;
     /** Function that is called when the user clicks on the window with secodary mouse button */
     onClickSecondary?: (window: Widget.Window) => void;
+    keymode?: Astal.Keymode;
 };
 
 /** Creates a fullscreen GtkWindow that is used for making
@@ -34,20 +35,25 @@ export function BackgroundWindow(props: BackgroundWindowProps) {
         monitor: props.monitor,
         layer: props.layer ?? Astal.Layer.OVERLAY,
         anchor: TOP | LEFT | BOTTOM | RIGHT,
+        keymode: props.keymode ?? Astal.Keymode.NONE,
         exclusivity: Astal.Exclusivity.IGNORE,
-        onButtonPressEvent: (window, event: Gdk.Event) => {
+        onKeyPressEvent: (self, event: Gdk.Event) => {
+            event.get_keyval()[1] === Gdk.KEY_Escape &&
+                props.onAction?.(self);
+        },
+        onButtonPressEvent: (self, event: Gdk.Event) => {
             if(event.get_button()[1]) {
-                props.onClick?.(window);
+                props.onAction?.(self);
                 return;
             }
 
             if(event.get_button()[1] === Gdk.BUTTON_PRIMARY) {
-                props.onClickPrimary?.(window);
+                props.onClickPrimary?.(self);
                 return;
             }
 
             if(event.get_button()[1] === Gdk.BUTTON_SECONDARY) 
-                props.onClickSecondary?.(window);
+                props.onClickSecondary?.(self);
         }
     } as Widget.WindowProps);
 }

ags/widget/PopupWindow.ts

@@ -18,7 +18,7 @@ export function PopupWindow(props: PopupWindowProps): Widget.Window {
         monitor: props.monitor ?? 0,
         layer: props.layer!,
         css: props.cssBackgroundWindow ?? "", 
-        onClick: (bgWin) => {
+        onAction: (bgWin) => {
             bgWin.close();
             window.close();
         }