fix(ags): use app.launch method

devices/wim/config/ags/js/applauncher/main.js

@@ -92,9 +92,7 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
 
             if (appList[0]) {
                 App.closeWindow(window_name);
-                Hyprland.sendMessage(`dispatch exec sh -c
+                appList[0].launch();
-                    ${appList[0].executable}`);
-                ++appList[0].frequency;
             }
         },
 

devices/wim/config/ags/js/notifications/base.js

@@ -69,10 +69,10 @@ const NotificationIcon = (notif) => {
                                     `focuswindow ^(${wmClass})`);
                             }
                             else {
-                                Hyprland.sendMessage('[[BATCH]] ' +
+                                Hyprland.sendMessage('dispatch workspace empty')
-                                    'dispatch workspace empty; ' +
+                                    .then(() => {
-                                    `dispatch exec sh -c ${app.executable}
+                                        app.launch();
-                                `);
+                                    });
                             }
                         });
                     }

devices/wim/config/ags/js/on-screen-keyboard/gesture.js

@@ -2,7 +2,7 @@ import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
 
 import { execAsync, timeout } from 'resource:///com/github/Aylur/ags/utils.js';
 
-import Gtk from 'gi://Gtk';
+const { Gtk } = imports.gi;
 
 import Tablet from '../../services/tablet.js';
 
@@ -20,124 +20,138 @@ const releaseAllKeys = () => {
     ]).catch(print);
 };
 
+/** @param {import('types/widgets/window').default} window */
 export default (window) => {
+    // @ts-expect-error
     window.child.setCss(`margin-bottom: -${HIDDEN_MARGIN}px;`);
     const gesture = Gtk.GestureDrag.new(window);
 
-    window.setVisible = (state) => {
+    let signals = [];
-        if (state) {
-            window.visible = true;
-            window.setSlideDown();
-            window.child.setCss(`
-                transition: margin-bottom 0.7s
-                    cubic-bezier(0.36, 0, 0.66, -0.56);
-                margin-bottom: 0px;
-            `);
-        }
-        else {
-            timeout(ANIM_DURATION + 10, () => {
-                if (!Tablet.tabletMode) {
-                    window.visible = false;
-                }
-            });
-            releaseAllKeys();
-            window.setSlideUp();
-            window.child.setCss(`
-                transition: margin-bottom 0.7s
-                    cubic-bezier(0.36, 0, 0.66, -0.56);
-                margin-bottom: -${HIDDEN_MARGIN}px;
-            `);
-        }
-    };
 
-    gesture.signals = [];
+    window.attribute = {
-    window.killGestureSigs = () => {
+        /** @param {boolean} state */
-        gesture.signals.forEach((id) => {
+        setVisible: (state) => {
-            gesture.disconnect(id);
+            if (state) {
-        });
+                window.visible = true;
-        gesture.signals = [];
+                window.attribute.setSlideDown();
-    };
 
-    window.setSlideUp = () => {
+                // @ts-expect-error
-        window.killGestureSigs();
-
-        // Begin drag
-        gesture.signals.push(
-            gesture.connect('drag-begin', () => {
-                Hyprland.sendMessage('j/cursorpos').then((out) => {
-                    gesture.startY = JSON.parse(out).y;
-                });
-            }),
-        );
-
-        // Update drag
-        gesture.signals.push(
-            gesture.connect('drag-update', () => {
-                Hyprland.sendMessage('j/cursorpos').then((out) => {
-                    const currentY = JSON.parse(out).y;
-                    const offset = gesture.startY - currentY;
-
-                    if (offset < 0) {
-                        return;
-                    }
-
-                    window.child.setCss(`
-                        margin-bottom: ${offset - HIDDEN_MARGIN}px;
-                    `);
-                });
-            }),
-        );
-
-        // End drag
-        gesture.signals.push(
-            gesture.connect('drag-end', () => {
                 window.child.setCss(`
-                    transition: margin-bottom 0.5s ease-in-out;
+                    transition: margin-bottom 0.7s
-                    margin-bottom: -${HIDDEN_MARGIN}px;
+                        cubic-bezier(0.36, 0, 0.66, -0.56);
-                `);
-            }),
-        );
-    };
-
-    window.setSlideDown = () => {
-        window.killGestureSigs();
-
-        // Begin drag
-        gesture.signals.push(
-            gesture.connect('drag-begin', () => {
-                Hyprland.sendMessage('j/cursorpos').then((out) => {
-                    gesture.startY = JSON.parse(out).y;
-                });
-            }),
-        );
-
-        // Update drag
-        gesture.signals.push(
-            gesture.connect('drag-update', () => {
-                Hyprland.sendMessage('j/cursorpos').then((out) => {
-                    const currentY = JSON.parse(out).y;
-                    const offset = gesture.startY - currentY;
-
-                    if (offset > 0) {
-                        return;
-                    }
-
-                    window.child.setCss(`
-                        margin-bottom: ${offset}px;
-                    `);
-                });
-            }),
-        );
-
-        // End drag
-        gesture.signals.push(
-            gesture.connect('drag-end', () => {
-                window.child.setCss(`
-                    transition: margin-bottom 0.5s ease-in-out;
                     margin-bottom: 0px;
                 `);
-            }),
+            }
-        );
+            else {
+                timeout(ANIM_DURATION + 10, () => {
+                    if (!Tablet.tabletMode) {
+                        window.visible = false;
+                    }
+                });
+                releaseAllKeys();
+                window.attribute.setSlideUp();
+
+                // @ts-expect-error
+                window.child.setCss(`
+                    transition: margin-bottom 0.7s
+                        cubic-bezier(0.36, 0, 0.66, -0.56);
+                    margin-bottom: -${HIDDEN_MARGIN}px;
+                `);
+            }
+        },
+
+        killGestureSigs: () => {
+            signals.forEach((id) => {
+                gesture.disconnect(id);
+            });
+            signals = [];
+        },
+
+        setSlideUp: () => {
+            window.attribute.killGestureSigs();
+
+            // Begin drag
+            signals.push(
+                gesture.connect('drag-begin', () => {
+                    Hyprland.sendMessage('j/cursorpos').then((out) => {
+                        gesture.startY = JSON.parse(out).y;
+                    });
+                }),
+            );
+
+            // Update drag
+            signals.push(
+                gesture.connect('drag-update', () => {
+                    Hyprland.sendMessage('j/cursorpos').then((out) => {
+                        const currentY = JSON.parse(out).y;
+                        const offset = gesture.startY - currentY;
+
+                        if (offset < 0) {
+                            return;
+                        }
+
+                        // @ts-expect-error
+                        window.child.setCss(`
+                            margin-bottom: ${offset - HIDDEN_MARGIN}px;
+                        `);
+                    });
+                }),
+            );
+
+            // End drag
+            signals.push(
+                gesture.connect('drag-end', () => {
+                    // @ts-expect-error
+                    window.child.setCss(`
+                        transition: margin-bottom 0.5s ease-in-out;
+                        margin-bottom: -${HIDDEN_MARGIN}px;
+                    `);
+                }),
+            );
+        },
+
+        setSlideDown: () => {
+            window.attribute.killGestureSigs();
+
+            // Begin drag
+            signals.push(
+                gesture.connect('drag-begin', () => {
+                    Hyprland.sendMessage('j/cursorpos').then((out) => {
+                        gesture.startY = JSON.parse(out).y;
+                    });
+                }),
+            );
+
+            // Update drag
+            signals.push(
+                gesture.connect('drag-update', () => {
+                    Hyprland.sendMessage('j/cursorpos').then((out) => {
+                        const currentY = JSON.parse(out).y;
+                        const offset = gesture.startY - currentY;
+
+                        if (offset > 0) {
+                            return;
+                        }
+
+                        // @ts-expect-error
+                        window.child.setCss(`
+                            margin-bottom: ${offset}px;
+                        `);
+                    });
+                }),
+            );
+
+            // End drag
+            signals.push(
+                gesture.connect('drag-end', () => {
+                    // @ts-expect-error
+                    window.child.setCss(`
+                        transition: margin-bottom 0.5s ease-in-out;
+                        margin-bottom: 0px;
+                    `);
+                }),
+            );
+        },
     };
 
     return window;

devices/wim/config/ags/js/on-screen-keyboard/keyboard.js

@@ -13,6 +13,7 @@ const COLOR = 'rgba(0, 0, 0, 0.3)';
 const SPACING = 4;
 
 
+/** @param {import('types/widgets/window').default} window */
 export default (window) => Box({
     vertical: true,
     children: [
@@ -26,6 +27,7 @@ export default (window) => Box({
             center_widget: CenterBox({
                 class_name: 'thingy',
                 css: `background: ${COLOR};`,
+
                 center_widget: Box({
                     hpack: 'center',
                     class_name: 'settings',
@@ -41,8 +43,10 @@ export default (window) => Box({
                                 self.on('toggled', () => {
                                     self.toggleClassName(
                                         'toggled',
+                                        // @ts-expect-error
                                         self.get_active(),
                                     );
+                                    // @ts-expect-error
                                     window.exclusivity = self.get_active() ?
                                         'exclusive' :
                                         'normal';
@@ -70,26 +74,33 @@ export default (window) => Box({
                 hpack: 'start',
                 vertical: true,
 
-                children: keyboardJson.keys.map((row, rowIndex) => Box({
+                children: keyboardJson.keys.map((row, rowIndex) => {
-                    vertical: true,
+                    const keys = [];
 
-                    children: [
+                    row.forEach((key, keyIndex) => {
-                        Box({
+                        if (keyIndex < L_KEY_PER_ROW[rowIndex]) {
-                            class_name: 'row',
+                            keys.push(Key(key));
+                        }
+                    });
 
-                            children: [
+                    return Box({
-                                Separator(SPACING),
+                        vertical: true,
-                                ...row.map((key, keyIndex) => {
-                                    return keyIndex < L_KEY_PER_ROW[rowIndex] ?
-                                        Key(key) :
-                                        null;
-                                }),
-                            ],
-                        }),
 
-                        Separator(SPACING, { vertical: true }),
+                        children: [
-                    ],
+                            Box({
-                })),
+                                class_name: 'row',
+
+                                children: [
+                                    Separator(SPACING),
+
+                                    ...keys,
+                                ],
+                            }),
+
+                            Separator(SPACING, { vertical: true }),
+                        ],
+                    });
+                }),
             }),
 
             center_widget: Box({
@@ -105,24 +116,30 @@ export default (window) => Box({
                 hpack: 'end',
                 vertical: true,
 
-                children: keyboardJson.keys.map((row, rowIndex) => Box({
+                children: keyboardJson.keys.map((row, rowIndex) => {
-                    vertical: true,
+                    const keys = [];
 
-                    children: [
+                    row.forEach((key, keyIndex) => {
-                        Box({
+                        if (keyIndex >= L_KEY_PER_ROW[rowIndex]) {
-                            hpack: 'end',
+                            keys.push(Key(key));
-                            class_name: 'row',
+                        }
+                    });
 
-                            children: row.map((key, keyIndex) => {
+                    return Box({
-                                return keyIndex >= L_KEY_PER_ROW[rowIndex] ?
+                        vertical: true,
-                                    Key(key) :
+
-                                    null;
+                        children: [
+                            Box({
+                                hpack: 'end',
+                                class_name: 'row',
+
+                                children: keys,
                             }),
-                        }),
 
-                        Separator(SPACING, { vertical: true }),
+                            Separator(SPACING, { vertical: true }),
-                    ],
+                        ],
-                })),
+                    });
+                }),
             }),
         }),
     ],

devices/wim/config/ags/js/on-screen-keyboard/keys.js

@@ -4,7 +4,7 @@ import Brightness from '../../services/brightness.js';
 import { Box, EventBox, Label } from 'resource:///com/github/Aylur/ags/widget.js';
 import { execAsync } from 'resource:///com/github/Aylur/ags/utils.js';
 
-import Gtk from 'gi://Gtk';
+const { Gtk } = imports.gi;
 
 import Separator from '../misc/separator.js';
 
@@ -44,6 +44,7 @@ const LALT_CODE = 56;
 const LCTRL_CODE = 29;
 
 
+/** @param {Object} key */
 const ModKey = (key) => {
     let Mod;
 
@@ -79,16 +80,20 @@ const ModKey = (key) => {
     const button = EventBox({
         cursor: 'pointer',
         class_name: 'key',
-        onPrimaryClickRelease: (self) => {
+        on_primary_click_release: (self) => {
             console.log('mod toggled');
 
             execAsync(`ydotool key ${key.keycode}:${Mod.value ? 0 : 1}`);
+
+            // @ts-expect-error
             self.child.toggleClassName('active', !Mod.value);
             Mod.value = !Mod.value;
         },
         setup: (self) => {
             self.hook(NormalClick, () => {
                 Mod.value = false;
+
+                // @ts-expect-error
                 self.child.toggleClassName('active', false);
                 execAsync(`ydotool key ${key.keycode}:0`);
             });
@@ -107,6 +112,7 @@ const ModKey = (key) => {
     });
 };
 
+/** @param {Object} key */
 const RegularKey = (key) => {
     const widget = EventBox({
         cursor: 'pointer',
@@ -198,6 +204,7 @@ const RegularKey = (key) => {
     });
 };
 
+/** @param {Object} key */
 export default (key) => key.keytype === 'normal' ?
     RegularKey(key) :
     ModKey(key);

devices/wim/config/ags/js/on-screen-keyboard/main.js

@@ -19,7 +19,7 @@ export default () => {
         setup: (self) => {
             self
                 .hook(Tablet, (_, state) => {
-                    self.setVisible(state);
+                    self.attribute.setVisible(state);
                 }, 'osk-toggled')
 
                 .hook(Tablet, () => {

devices/wim/config/ags/js/osd/ctor.js

@@ -3,13 +3,13 @@ import { Box, Icon, ProgressBar } from 'resource:///com/github/Aylur/ags/widget.
 const Y_POS = 80;
 
 
-export default ({ stack, icon, info } = {}) => {
+export default ({ stack, icon, info }) => {
     let connectFunc;
 
     const osd = Box({
         css: `margin-bottom: ${Y_POS}px;`,
         children: [Box({
-            className: 'osd',
+            class_name: 'osd',
             children: [
                 Icon({
                     hpack: 'start',
@@ -27,15 +27,21 @@ export default ({ stack, icon, info } = {}) => {
     // Handle requests to show the OSD
     // Different wether it's a bar or static
     if (info.logic) {
+        /**
+         * @param {import('types/widgets/box').default} self
+         * @returns {Promise<void>}
+         */
         connectFunc = (self) => new Promise((r) => {
             info.logic(self);
+            // @ts-expect-error
             r();
-        }).then(() => stack.popup(osd));
+        }).then(() => stack.attribute.popup(osd));
     }
     else {
-        connectFunc = () => stack.popup(osd);
+        connectFunc = () => stack.attribute.popup(osd);
     }
 
+    // @ts-expect-error
     osd.children[0].children[1].hook(info.mod, connectFunc, info.signal);
 
     return osd;

devices/wim/config/ags/js/osd/main.js

@@ -19,19 +19,22 @@ const HIDE_DELAY = 2000;
 const OSDs = () => {
     const stack = Stack({
         transition: 'over_up_down',
-        transitionDuration: 200,
+        transition_duration: 200,
+
+        attribute: {
+            popup: () => {/**/},
+        },
     });
 
     stack.items = OSDList.map((osd, i) => [`${i}`, osd(stack)]);
 
-    stack.popup = () => { /**/ };
-
     // Delay popup method so it
     // doesn't show any OSDs at launch
     timeout(1000, () => {
         let count = 0;
 
-        stack.popup = (osd) => {
+        /** @param {import('types/widgets/box').default} osd */
+        stack.attribute.popup = (osd) => {
             ++count;
             stack.set_visible_child(osd);
             App.openWindow('osd');

devices/wim/config/ags/js/osd/osds.js

@@ -10,18 +10,26 @@ import { MicIcon } from '../misc/audio-icons.js';
 
 const AUDIO_MAX = 1.5;
 
-
 const ShowSpeaker = Variable(true);
 
 globalThis.showSpeaker = () => {
     ShowSpeaker.value = !ShowSpeaker.value;
 };
 
+/**
+ * @typedef {import('types/widgets/stack').default} Stack
+ * @typedef {import('types/widgets/progressbar').default} ProgressBar
+ */
+
+
+/** @param {Stack} stack */
 export const SpeakerOSD = (stack) => OSD({
     stack,
-    icon: { binds: [['icon', SpeakerIcon, 'value']] },
+    icon: { icon: SpeakerIcon.bind() },
     info: {
         mod: ShowSpeaker,
+
+        /** @param {ProgressBar} self */
         logic: (self) => {
             if (!Audio.speaker) {
                 return;
@@ -31,29 +39,35 @@ export const SpeakerOSD = (stack) => OSD({
                 Audio.speaker.volume / AUDIO_MAX :
                 0;
 
-            self.sensitive = !Audio.speaker?.stream.isMuted;
+            self.sensitive = !Audio.speaker?.stream.is_muted;
         },
     },
 });
 
+/** @param {Stack} stack */
 export const ScreenBrightnessOSD = (stack) => OSD({
     stack,
-    icon: { binds: [['icon', Brightness, 'screen-icon']] },
+    icon: { icon: Brightness.bind('screenIcon') },
     info: {
         mod: Brightness,
         signal: 'screen',
+
+        /** @param {ProgressBar} self */
         logic: (self) => {
             self.value = Brightness.screen;
         },
     },
 });
 
+/** @param {Stack} stack */
 export const KbdBrightnessOSD = (stack) => OSD({
     stack,
     icon: 'keyboard-brightness-symbolic',
     info: {
         mod: Brightness,
         signal: 'kbd',
+
+        /** @param {ProgressBar} self */
         logic: (self) => {
             if (!self.value) {
                 self.value = Brightness.kbd / 2;
@@ -66,26 +80,30 @@ export const KbdBrightnessOSD = (stack) => OSD({
     },
 });
 
+/** @param {Stack} stack */
 export const MicOSD = (stack) => OSD({
     stack,
-    icon: { binds: [['icon', MicIcon, 'value']] },
+    icon: { icon: MicIcon.bind() },
     info: {
         mod: Audio,
         signal: 'microphone-changed',
+
+        /** @param {ProgressBar} self */
         logic: (self) => {
             if (!Audio.microphone) {
                 return;
             }
 
             self.value = Audio.microphone ? Audio.microphone.volume : 0;
-            self.sensitive = !Audio.microphone?.stream.isMuted;
+            self.sensitive = !Audio.microphone?.stream.is_muted;
         },
     },
 });
 
+/** @param {Stack} stack */
 export const CapsLockOSD = (stack) => OSD({
     stack,
-    icon: { binds: [['icon', Brightness, 'caps-icon']] },
+    icon: { icon: Brightness.bind('capsIcon') },
     info: {
         mod: Brightness,
         signal: 'caps',