✨ ags(background-window, popup-window): use props on background-window, use new background-window on popup-window

ags/widget/BackgroundWindow.ts

@@ -1,30 +1,49 @@
 import { Astal, Gdk, Widget } from "astal/gtk3";
 
+
 const { TOP, LEFT, RIGHT, BOTTOM } = Astal.WindowAnchor;
 
+export type BackgroundWindowProps = {
+    /** Monitor number where the window should open */
+    monitor: number;
+    /** Custom stylesheet used in the window. default: `background: rgba(0, 0, 0, .2)` */
+    css?: string;
+    /** Function that is called when the user clicks on the window (any mouse button) */
+    onClick?: (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;
+};
+
 /** Creates a fullscreen GtkWindow that is used for making
  * the user focus on the content after this window(e.g.: AskPopup,
- * Authentication Window...)
+ * Authentication Window(futurely) or any PopupWindow)
  *
- * @param css Custom stylesheet used in the window. defaults to setting `background-color` to rgba(0, 0, 0, .2)
- * @param onClick Function that is called when the user clicks on the window
- * @returns the generated background window
+ * @param props Properties for background-window
+ *
+ * @returns The generated background window
  */
-export function BackgroundWindow(css?: (string | null), onClickPrimary?: (((window: Widget.Window) => void) | null),
-                                onClickSecondary?: (((window: Widget.Window) => void) | null)): Widget.Window {
+export function BackgroundWindow(props: BackgroundWindowProps) {
     return new Widget.Window({
         namespace: "background-window",
-        css: css ?? "background: rgba(0, 0, 0, .2);",
+        css: props.css ?? "background: rgba(0, 0, 0, .2);",
+        monitor: props.monitor,
         anchor: TOP | LEFT | BOTTOM | RIGHT,
         exclusivity: Astal.Exclusivity.IGNORE,
         onButtonPressEvent: (window, event: Gdk.Event) => {
+            if(event.get_button()[1]) {
+                props.onClick?.(window);
+                return;
+            }
+
             if(event.get_button()[1] === Gdk.BUTTON_PRIMARY) {
-                onClickPrimary?.(window);
+                props.onClickPrimary?.(window);
                 return;
             }
 
             if(event.get_button()[1] === Gdk.BUTTON_SECONDARY) 
-                onClickSecondary?.(window);
+                props.onClickSecondary?.(window);
         }
     } as Widget.WindowProps);
 }