Implement framework for custom modules and out of the box custom modules as well. (#213)

* Create declarative module scaffolding

* Added ram module (WIP)

* Updates to options, styling and more.

* Added function for styling custom modules.

* Added utility functions and cleaned up code

* Type and fn name updates.

* Update module utils to handle absent values.

* Added icon color in style2 that was missing.

* Linted utils.ts

* Add CPU module and update RAM module to use /proc/meminfo.

* Added disk storage module.

* Consolidate code

* Added netstat module and removed elements from systray default ignore list.

* Added keyboard layout module.

* Fix hook types and move module to customModules directory

* Added updates modules.

* Spacing updates

* Added weather module.

* Added power menu and power module in bar. Increased update default interval to 6 ours.

* Updated styling of bar buttons, made power menu label toggleable, etc.

* Consolidate code and add dynamic tooltips based on data being used.

* Make default custom mogules matugen compatible

* Update base theme

* Fix custom module background coloring

* Remove testing opacity.

* Update themes to account for new modules

* Update nix stuff for libgtop (Need someone to test this)

* Update nix

* Update fractions to multiplications

* Move styling in style directory

* Implement a polling framework for variables that can dynamically adjust polling intervals.

* Netstat module updates when interface name is changed.

* Readme update

modules/menus/powerDropdown/button.ts

@@ -0,0 +1,57 @@
+import icons from "lib/icons";
+import { PowerOptions } from "lib/types/options";
+import options from "options";
+import powermenu from "../power/helpers/actions";
+
+const { confirmation, shutdown, logout, sleep, reboot, showLabel } = options.menus.power;
+
+export const PowerButton = (action: PowerOptions) => {
+    const handleClick = (action: PowerOptions) => {
+        const actions = {
+            shutdown: shutdown.value,
+            reboot: reboot.value,
+            logout: logout.value,
+            sleep: sleep.value,
+        };
+        App.closeWindow("powerdropdownmenu");
+
+        if (!confirmation.value) {
+            Utils.execAsync(actions[action])
+                .catch((err) => console.error(`Failed to execute ${action} command. Error: ${err}`));
+        } else {
+            powermenu.customAction(action, actions[action]);
+        }
+    };
+
+    return Widget.Button({
+        className: showLabel.bind("value").as(shwLbl => {
+            return `power-menu-button ${action} ${!shwLbl ? "no-label" : ""}`;
+        }),
+        on_clicked: () => handleClick(action),
+        child: Widget.Box({
+            vertical: false,
+            children: showLabel.bind("value").as(shwLbl => {
+                if (shwLbl) {
+                    return [
+                        Widget.Icon({
+                            icon: icons.powermenu[action],
+                            className: `power-button-icon ${action}-icon`,
+                        }),
+                        Widget.Label({
+                            hpack: "center",
+                            hexpand: true,
+                            label: action.charAt(0).toUpperCase() + action.slice(1),
+                            className: `power-button-label ${action}-label show-label`,
+                        }),
+                    ];
+                }
+                return [
+                    Widget.Icon({
+                        icon: icons.powermenu[action],
+                        className: `power-button-icon ${action}-icon no-label`,
+                    }),
+                ];
+            }),
+        })
+    });
+};

modules/menus/powerDropdown/index.ts

@@ -0,0 +1,27 @@
+import options from "options.js";
+import DropdownMenu from "../DropdownMenu.js";
+import { PowerButton } from "./button.js";
+
+const { showLabel } = options.menus.power;
+
+export default () => {
+    return DropdownMenu({
+        name: "powerdropdownmenu",
+        transition: "crossfade",
+        child: Widget.Box({
+            class_name: "menu-items power-dropdown",
+            child: Widget.Box({
+                vertical: true,
+                hexpand: true,
+                class_name: "menu-items-container power-dropdown",
+                children: [
+                    PowerButton('shutdown'),
+                    PowerButton('reboot'),
+                    PowerButton('logout'),
+                    PowerButton('sleep'),
+                ],
+            }),
+        }),
+    });
+};
+