diff --git a/.eslintrc.js b/.eslintrc.js
deleted file mode 100644
index 936a435..0000000
--- a/.eslintrc.js
+++ /dev/null
@@ -1,25 +0,0 @@
-module.exports = {
-    parser: '@typescript-eslint/parser',
-    parserOptions: {
-        project: 'tsconfig.json',
-        tsconfigRootDir: __dirname,
-        sourceType: 'module',
-    },
-    plugins: ['@typescript-eslint', 'import'],
-    extends: ['plugin:@typescript-eslint/recommended', 'plugin:prettier/recommended'],
-    root: true,
-    ignorePatterns: ["/*", "!/src"],
-    env: {
-        es6: true,
-        browser: true,
-    },
-    rules: {
-        '@typescript-eslint/interface-name-prefix': 'off',
-        '@typescript-eslint/explicit-function-return-type': 'error',
-        '@typescript-eslint/explicit-module-boundary-types': 'error',
-        '@typescript-eslint/no-explicit-any': 'error',
-        'import/extensions': ['off'],
-        'import/no-unresolved': 'off',
-        quotes: ['error', 'single', { avoidEscape: true, allowTemplateLiterals: true }],
-    },
-};
diff --git a/.eslintrc.json b/.eslintrc.json
new file mode 100644
index 0000000..ea5ad1b
--- /dev/null
+++ b/.eslintrc.json
@@ -0,0 +1,72 @@
+{
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "project": "tsconfig.json",
+        "tsconfigRootDir": ".",
+        "sourceType": "module"
+    },
+    "plugins": ["@typescript-eslint/eslint-plugin", "prettier"],
+    "extends": ["plugin:@typescript-eslint/recommended", "plugin:prettier/recommended"],
+    "root": true,
+    "env": {
+        "node": true,
+        "jest": true
+    },
+    "ignorePatterns": ["/*", "!/src"],
+    "rules": {
+        "@typescript-eslint/interface-name-prefix": "off",
+        "@typescript-eslint/explicit-function-return-type": "error",
+        "@typescript-eslint/no-explicit-any": "error",
+        "@typescript-eslint/no-non-null-assertion": "error",
+        "@typescript-eslint/prefer-enum-initializers": "error",
+        "@typescript-eslint/no-mixed-enums": "error",
+        "@typescript-eslint/no-unused-vars": "error",
+        "@typescript-eslint/explicit-member-accessibility": [
+            "error",
+            {
+                "accessibility": "explicit",
+                "overrides": {
+                    "constructors": "no-public"
+                }
+            }
+        ],
+        "quotes": [
+            "error",
+            "single",
+            {
+                "allowTemplateLiterals": false,
+                "avoidEscape": true
+            }
+        ],
+        "prettier/prettier": [
+            "error",
+            {
+                "singleQuote": true,
+                "trailingComma": "all",
+                "printWidth": 110,
+                "tabWidth": 4
+            }
+        ],
+        "no-param-reassign": [
+            "error",
+            { "props": true, "ignorePropertyModificationsFor": ["self", "ref", "el"] }
+        ],
+        "@typescript-eslint/naming-convention": [
+            "error",
+            {
+                "selector": "typeLike",
+                "format": ["PascalCase"]
+            },
+            {
+                "selector": "enumMember",
+                "format": ["UPPER_CASE"]
+            },
+            {
+                "selector": "memberLike",
+                "modifiers": ["private"],
+                "format": null,
+                "leadingUnderscore": "require"
+            }
+        ]
+    }
+}
diff --git a/.prettierrc b/.prettierrc
index 255816c..408e3cc 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -2,7 +2,7 @@
     "singleQuote": true,
     "semi": true,
     "trailingComma": "all",
-    "printWidth": 120,
+    "printWidth": 110,
     "tabWidth": 4,
     "useTabs": false,
     "overrides": [
diff --git a/app.ts b/app.ts
index f5d48d7..4b7f175 100644
--- a/app.ts
+++ b/app.ts
@@ -1,10 +1,10 @@
 import './src/lib/session';
 import './src/scss/style';
-import './src/globals/useTheme';
-import './src/globals/wallpaper';
-import './src/globals/systray';
-import './src/globals/dropdown';
-import './src/globals/utilities';
+import './src/shared/useTheme';
+import './src/shared/wallpaper';
+import './src/shared/systray';
+import './src/shared/dropdown';
+import './src/shared/utilities';
 import './src/components/bar/utils/sideEffects';
 
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
diff --git a/package-lock.json b/package-lock.json
index fc70eb6..879017c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,7 +21,7 @@
                 "eslint-plugin-prettier": "^5.2.1",
                 "prettier": "^3.3.3",
                 "tsconfig-paths": "^4.2.0",
-                "typescript": "^5.6.2"
+                "typescript": "5.7.3"
             }
         },
         "../../../../usr/share/astal/gjs": {
@@ -29,24 +29,27 @@
             "license": "LGPL-2.1"
         },
         "node_modules/@eslint-community/eslint-utils": {
-            "version": "4.4.0",
-            "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
-            "integrity": "sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==",
+            "version": "4.7.0",
+            "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz",
+            "integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==",
             "dev": true,
             "dependencies": {
-                "eslint-visitor-keys": "^3.3.0"
+                "eslint-visitor-keys": "^3.4.3"
             },
             "engines": {
                 "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
             },
+            "funding": {
+                "url": "https://opencollective.com/eslint"
+            },
             "peerDependencies": {
                 "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
             }
         },
         "node_modules/@eslint-community/regexpp": {
-            "version": "4.11.1",
-            "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.1.tgz",
-            "integrity": "sha512-m4DVN9ZqskZoLU5GlWZadwDnYo3vAEydiUayB9widCl9ffWx2IvPnp6n3on5rJmziJSw9Bv+Z3ChDVdMwXCY8Q==",
+            "version": "4.12.1",
+            "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.1.tgz",
+            "integrity": "sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==",
             "dev": true,
             "engines": {
                 "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
@@ -98,22 +101,22 @@
             }
         },
         "node_modules/@eslint/js": {
-            "version": "8.57.0",
-            "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz",
-            "integrity": "sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==",
+            "version": "8.57.1",
+            "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz",
+            "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==",
             "dev": true,
             "engines": {
                 "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
             }
         },
         "node_modules/@humanwhocodes/config-array": {
-            "version": "0.11.14",
-            "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
-            "integrity": "sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==",
+            "version": "0.13.0",
+            "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
+            "integrity": "sha512-DZLEEqFWQFiyK6h5YIeynKx7JlvCYWL0cImfSRXZ9l4Sg2efkFGTuFf6vzXjK1cq6IYkU+Eg/JizXw+TD2vRNw==",
             "deprecated": "Use @eslint/config-array instead",
             "dev": true,
             "dependencies": {
-                "@humanwhocodes/object-schema": "^2.0.2",
+                "@humanwhocodes/object-schema": "^2.0.3",
                 "debug": "^4.3.1",
                 "minimatch": "^3.0.5"
             },
@@ -199,15 +202,15 @@
             }
         },
         "node_modules/@pkgr/core": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.1.1.tgz",
-            "integrity": "sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==",
+            "version": "0.2.4",
+            "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.2.4.tgz",
+            "integrity": "sha512-ROFF39F6ZrnzSUEmQQZUar0Jt4xVoP9WnDRdWwF4NNcXs3xBTLgBUDoOwW141y1jP+S8nahIbdxbFC7IShw9Iw==",
             "dev": true,
             "engines": {
                 "node": "^12.20.0 || ^14.18.0 || >=16.0.0"
             },
             "funding": {
-                "url": "https://opencollective.com/unts"
+                "url": "https://opencollective.com/pkgr"
             }
         },
         "node_modules/@rtsao/scc": {
@@ -223,29 +226,29 @@
             "dev": true
         },
         "node_modules/@types/node": {
-            "version": "22.5.5",
-            "resolved": "https://registry.npmjs.org/@types/node/-/node-22.5.5.tgz",
-            "integrity": "sha512-Xjs4y5UPO/CLdzpgR6GirZJx36yScjh73+2NlLlkFRSoQN8B0DpfXPdZGnvVmLRLOsqDpOfTNv7D9trgGhmOIA==",
+            "version": "22.15.17",
+            "resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.17.tgz",
+            "integrity": "sha512-wIX2aSZL5FE+MR0JlvF87BNVrtFWf6AE6rxSE9X7OwnVvoyCQjpzSRJ+M87se/4QCkCiebQAqrJ0y6fwIyi7nw==",
             "dev": true,
             "dependencies": {
-                "undici-types": "~6.19.2"
+                "undici-types": "~6.21.0"
             }
         },
         "node_modules/@typescript-eslint/eslint-plugin": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.5.0.tgz",
-            "integrity": "sha512-lHS5hvz33iUFQKuPFGheAB84LwcJ60G8vKnEhnfcK1l8kGVLro2SFYW6K0/tj8FUhRJ0VHyg1oAfg50QGbPPHw==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.32.0.tgz",
+            "integrity": "sha512-/jU9ettcntkBFmWUzzGgsClEi2ZFiikMX5eEQsmxIAWMOn4H3D4rvHssstmAHGVvrYnaMqdWWWg0b5M6IN/MTQ==",
             "dev": true,
             "dependencies": {
                 "@eslint-community/regexpp": "^4.10.0",
-                "@typescript-eslint/scope-manager": "8.5.0",
-                "@typescript-eslint/type-utils": "8.5.0",
-                "@typescript-eslint/utils": "8.5.0",
-                "@typescript-eslint/visitor-keys": "8.5.0",
+                "@typescript-eslint/scope-manager": "8.32.0",
+                "@typescript-eslint/type-utils": "8.32.0",
+                "@typescript-eslint/utils": "8.32.0",
+                "@typescript-eslint/visitor-keys": "8.32.0",
                 "graphemer": "^1.4.0",
                 "ignore": "^5.3.1",
                 "natural-compare": "^1.4.0",
-                "ts-api-utils": "^1.3.0"
+                "ts-api-utils": "^2.1.0"
             },
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -256,24 +259,20 @@
             },
             "peerDependencies": {
                 "@typescript-eslint/parser": "^8.0.0 || ^8.0.0-alpha.0",
-                "eslint": "^8.57.0 || ^9.0.0"
-            },
-            "peerDependenciesMeta": {
-                "typescript": {
-                    "optional": true
-                }
+                "eslint": "^8.57.0 || ^9.0.0",
+                "typescript": ">=4.8.4 <5.9.0"
             }
         },
         "node_modules/@typescript-eslint/parser": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.5.0.tgz",
-            "integrity": "sha512-gF77eNv0Xz2UJg/NbpWJ0kqAm35UMsvZf1GHj8D9MRFTj/V3tAciIWXfmPLsAAF/vUlpWPvUDyH1jjsr0cMVWw==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.32.0.tgz",
+            "integrity": "sha512-B2MdzyWxCE2+SqiZHAjPphft+/2x2FlO9YBx7eKE1BCb+rqBlQdhtAEhzIEdozHd55DXPmxBdpMygFJjfjjA9A==",
             "dev": true,
             "dependencies": {
-                "@typescript-eslint/scope-manager": "8.5.0",
-                "@typescript-eslint/types": "8.5.0",
-                "@typescript-eslint/typescript-estree": "8.5.0",
-                "@typescript-eslint/visitor-keys": "8.5.0",
+                "@typescript-eslint/scope-manager": "8.32.0",
+                "@typescript-eslint/types": "8.32.0",
+                "@typescript-eslint/typescript-estree": "8.32.0",
+                "@typescript-eslint/visitor-keys": "8.32.0",
                 "debug": "^4.3.4"
             },
             "engines": {
@@ -284,22 +283,18 @@
                 "url": "https://opencollective.com/typescript-eslint"
             },
             "peerDependencies": {
-                "eslint": "^8.57.0 || ^9.0.0"
-            },
-            "peerDependenciesMeta": {
-                "typescript": {
-                    "optional": true
-                }
+                "eslint": "^8.57.0 || ^9.0.0",
+                "typescript": ">=4.8.4 <5.9.0"
             }
         },
         "node_modules/@typescript-eslint/scope-manager": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.5.0.tgz",
-            "integrity": "sha512-06JOQ9Qgj33yvBEx6tpC8ecP9o860rsR22hWMEd12WcTRrfaFgHr2RB/CA/B+7BMhHkXT4chg2MyboGdFGawYg==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.32.0.tgz",
+            "integrity": "sha512-jc/4IxGNedXkmG4mx4nJTILb6TMjL66D41vyeaPWvDUmeYQzF3lKtN15WsAeTr65ce4mPxwopPSo1yUUAWw0hQ==",
             "dev": true,
             "dependencies": {
-                "@typescript-eslint/types": "8.5.0",
-                "@typescript-eslint/visitor-keys": "8.5.0"
+                "@typescript-eslint/types": "8.32.0",
+                "@typescript-eslint/visitor-keys": "8.32.0"
             },
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -310,15 +305,15 @@
             }
         },
         "node_modules/@typescript-eslint/type-utils": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.5.0.tgz",
-            "integrity": "sha512-N1K8Ix+lUM+cIDhL2uekVn/ZD7TZW+9/rwz8DclQpcQ9rk4sIL5CAlBC0CugWKREmDjBzI/kQqU4wkg46jWLYA==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.32.0.tgz",
+            "integrity": "sha512-t2vouuYQKEKSLtJaa5bB4jHeha2HJczQ6E5IXPDPgIty9EqcJxpr1QHQ86YyIPwDwxvUmLfP2YADQ5ZY4qddZg==",
             "dev": true,
             "dependencies": {
-                "@typescript-eslint/typescript-estree": "8.5.0",
-                "@typescript-eslint/utils": "8.5.0",
+                "@typescript-eslint/typescript-estree": "8.32.0",
+                "@typescript-eslint/utils": "8.32.0",
                 "debug": "^4.3.4",
-                "ts-api-utils": "^1.3.0"
+                "ts-api-utils": "^2.1.0"
             },
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -327,16 +322,15 @@
                 "type": "opencollective",
                 "url": "https://opencollective.com/typescript-eslint"
             },
-            "peerDependenciesMeta": {
-                "typescript": {
-                    "optional": true
-                }
+            "peerDependencies": {
+                "eslint": "^8.57.0 || ^9.0.0",
+                "typescript": ">=4.8.4 <5.9.0"
             }
         },
         "node_modules/@typescript-eslint/types": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.5.0.tgz",
-            "integrity": "sha512-qjkormnQS5wF9pjSi6q60bKUHH44j2APxfh9TQRXK8wbYVeDYYdYJGIROL87LGZZ2gz3Rbmjc736qyL8deVtdw==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.32.0.tgz",
+            "integrity": "sha512-O5Id6tGadAZEMThM6L9HmVf5hQUXNSxLVKeGJYWNhhVseps/0LddMkp7//VDkzwJ69lPL0UmZdcZwggj9akJaA==",
             "dev": true,
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -347,43 +341,19 @@
             }
         },
         "node_modules/@typescript-eslint/typescript-estree": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.5.0.tgz",
-            "integrity": "sha512-vEG2Sf9P8BPQ+d0pxdfndw3xIXaoSjliG0/Ejk7UggByZPKXmJmw3GW5jV2gHNQNawBUyfahoSiCFVov0Ruf7Q==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.32.0.tgz",
+            "integrity": "sha512-pU9VD7anSCOIoBFnhTGfOzlVFQIA1XXiQpH/CezqOBaDppRwTglJzCC6fUQGpfwey4T183NKhF1/mfatYmjRqQ==",
             "dev": true,
             "dependencies": {
-                "@typescript-eslint/types": "8.5.0",
-                "@typescript-eslint/visitor-keys": "8.5.0",
+                "@typescript-eslint/types": "8.32.0",
+                "@typescript-eslint/visitor-keys": "8.32.0",
                 "debug": "^4.3.4",
                 "fast-glob": "^3.3.2",
                 "is-glob": "^4.0.3",
                 "minimatch": "^9.0.4",
                 "semver": "^7.6.0",
-                "ts-api-utils": "^1.3.0"
-            },
-            "engines": {
-                "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/typescript-eslint"
-            },
-            "peerDependenciesMeta": {
-                "typescript": {
-                    "optional": true
-                }
-            }
-        },
-        "node_modules/@typescript-eslint/utils": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.5.0.tgz",
-            "integrity": "sha512-6yyGYVL0e+VzGYp60wvkBHiqDWOpT63pdMV2CVG4LVDd5uR6q1qQN/7LafBZtAtNIn/mqXjsSeS5ggv/P0iECw==",
-            "dev": true,
-            "dependencies": {
-                "@eslint-community/eslint-utils": "^4.4.0",
-                "@typescript-eslint/scope-manager": "8.5.0",
-                "@typescript-eslint/types": "8.5.0",
-                "@typescript-eslint/typescript-estree": "8.5.0"
+                "ts-api-utils": "^2.1.0"
             },
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -393,17 +363,40 @@
                 "url": "https://opencollective.com/typescript-eslint"
             },
             "peerDependencies": {
-                "eslint": "^8.57.0 || ^9.0.0"
+                "typescript": ">=4.8.4 <5.9.0"
+            }
+        },
+        "node_modules/@typescript-eslint/utils": {
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.32.0.tgz",
+            "integrity": "sha512-8S9hXau6nQ/sYVtC3D6ISIDoJzS1NsCK+gluVhLN2YkBPX+/1wkwyUiDKnxRh15579WoOIyVWnoyIf3yGI9REw==",
+            "dev": true,
+            "dependencies": {
+                "@eslint-community/eslint-utils": "^4.7.0",
+                "@typescript-eslint/scope-manager": "8.32.0",
+                "@typescript-eslint/types": "8.32.0",
+                "@typescript-eslint/typescript-estree": "8.32.0"
+            },
+            "engines": {
+                "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/typescript-eslint"
+            },
+            "peerDependencies": {
+                "eslint": "^8.57.0 || ^9.0.0",
+                "typescript": ">=4.8.4 <5.9.0"
             }
         },
         "node_modules/@typescript-eslint/visitor-keys": {
-            "version": "8.5.0",
-            "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.5.0.tgz",
-            "integrity": "sha512-yTPqMnbAZJNy2Xq2XU8AdtOW9tJIr+UQb64aXB9f3B1498Zx9JorVgFJcZpEc9UBuCCrdzKID2RGAMkYcDtZOw==",
+            "version": "8.32.0",
+            "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.32.0.tgz",
+            "integrity": "sha512-1rYQTCLFFzOI5Nl0c8LUpJT8HxpwVRn9E4CkMsYfuN6ctmQqExjSTzzSk0Tz2apmXy7WU6/6fyaZVVA/thPN+w==",
             "dev": true,
             "dependencies": {
-                "@typescript-eslint/types": "8.5.0",
-                "eslint-visitor-keys": "^3.4.3"
+                "@typescript-eslint/types": "8.32.0",
+                "eslint-visitor-keys": "^4.2.0"
             },
             "engines": {
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -413,16 +406,28 @@
                 "url": "https://opencollective.com/typescript-eslint"
             }
         },
+        "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz",
+            "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==",
+            "dev": true,
+            "engines": {
+                "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+            },
+            "funding": {
+                "url": "https://opencollective.com/eslint"
+            }
+        },
         "node_modules/@ungap/structured-clone": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
-            "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.0.tgz",
+            "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
             "dev": true
         },
         "node_modules/acorn": {
-            "version": "8.12.1",
-            "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
-            "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
+            "version": "8.14.1",
+            "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz",
+            "integrity": "sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==",
             "dev": true,
             "bin": {
                 "acorn": "bin/acorn"
@@ -487,13 +492,13 @@
             "dev": true
         },
         "node_modules/array-buffer-byte-length": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
-            "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+            "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.5",
-                "is-array-buffer": "^3.0.4"
+                "call-bound": "^1.0.3",
+                "is-array-buffer": "^3.0.5"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -523,17 +528,18 @@
             }
         },
         "node_modules/array.prototype.findlastindex": {
-            "version": "1.2.5",
-            "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.5.tgz",
-            "integrity": "sha512-zfETvRFA8o7EiNn++N5f/kaCw221hrpGsDmcpndVupkPzEc1Wuf3VgC0qby1BbHs7f5DVYjgtEU2LLh5bqeGfQ==",
+            "version": "1.2.6",
+            "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.6.tgz",
+            "integrity": "sha512-F/TKATkzseUExPlfvmwQKGITM3DGTK+vkAsCZoDc5daVygbJBnjEUCbgkAvVFsgfXfX4YIqZ/27G3k3tdXrTxQ==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.4",
                 "define-properties": "^1.2.1",
-                "es-abstract": "^1.23.2",
+                "es-abstract": "^1.23.9",
                 "es-errors": "^1.3.0",
-                "es-object-atoms": "^1.0.0",
-                "es-shim-unscopables": "^1.0.2"
+                "es-object-atoms": "^1.1.1",
+                "es-shim-unscopables": "^1.1.0"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -543,15 +549,15 @@
             }
         },
         "node_modules/array.prototype.flat": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.2.tgz",
-            "integrity": "sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==",
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz",
+            "integrity": "sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "define-properties": "^1.2.0",
-                "es-abstract": "^1.22.1",
-                "es-shim-unscopables": "^1.0.0"
+                "call-bind": "^1.0.8",
+                "define-properties": "^1.2.1",
+                "es-abstract": "^1.23.5",
+                "es-shim-unscopables": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -561,15 +567,15 @@
             }
         },
         "node_modules/array.prototype.flatmap": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.2.tgz",
-            "integrity": "sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ==",
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz",
+            "integrity": "sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "define-properties": "^1.2.0",
-                "es-abstract": "^1.22.1",
-                "es-shim-unscopables": "^1.0.0"
+                "call-bind": "^1.0.8",
+                "define-properties": "^1.2.1",
+                "es-abstract": "^1.23.5",
+                "es-shim-unscopables": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -579,19 +585,18 @@
             }
         },
         "node_modules/arraybuffer.prototype.slice": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
-            "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+            "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
             "dev": true,
             "dependencies": {
                 "array-buffer-byte-length": "^1.0.1",
-                "call-bind": "^1.0.5",
+                "call-bind": "^1.0.8",
                 "define-properties": "^1.2.1",
-                "es-abstract": "^1.22.3",
-                "es-errors": "^1.2.1",
-                "get-intrinsic": "^1.2.3",
-                "is-array-buffer": "^3.0.4",
-                "is-shared-array-buffer": "^1.0.2"
+                "es-abstract": "^1.23.5",
+                "es-errors": "^1.3.0",
+                "get-intrinsic": "^1.2.6",
+                "is-array-buffer": "^3.0.4"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -604,6 +609,15 @@
             "resolved": "../../../../usr/share/astal/gjs",
             "link": true
         },
+        "node_modules/async-function": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+            "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
         "node_modules/available-typed-arrays": {
             "version": "1.0.7",
             "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
@@ -647,16 +661,44 @@
             }
         },
         "node_modules/call-bind": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
-            "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
+            "version": "1.0.8",
+            "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+            "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
             "dev": true,
             "dependencies": {
+                "call-bind-apply-helpers": "^1.0.0",
                 "es-define-property": "^1.0.0",
-                "es-errors": "^1.3.0",
-                "function-bind": "^1.1.2",
                 "get-intrinsic": "^1.2.4",
-                "set-function-length": "^1.2.1"
+                "set-function-length": "^1.2.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/call-bind-apply-helpers": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+            "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+            "dev": true,
+            "dependencies": {
+                "es-errors": "^1.3.0",
+                "function-bind": "^1.1.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/call-bound": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+            "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+            "dev": true,
+            "dependencies": {
+                "call-bind-apply-helpers": "^1.0.2",
+                "get-intrinsic": "^1.3.0"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -715,9 +757,9 @@
             "dev": true
         },
         "node_modules/cross-spawn": {
-            "version": "7.0.3",
-            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
-            "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+            "version": "7.0.6",
+            "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+            "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
             "dev": true,
             "dependencies": {
                 "path-key": "^3.1.0",
@@ -729,14 +771,14 @@
             }
         },
         "node_modules/data-view-buffer": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz",
-            "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==",
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+            "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.6",
+                "call-bound": "^1.0.3",
                 "es-errors": "^1.3.0",
-                "is-data-view": "^1.0.1"
+                "is-data-view": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -746,29 +788,29 @@
             }
         },
         "node_modules/data-view-byte-length": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz",
-            "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==",
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+            "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bound": "^1.0.3",
                 "es-errors": "^1.3.0",
-                "is-data-view": "^1.0.1"
+                "is-data-view": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
             },
             "funding": {
-                "url": "https://github.com/sponsors/ljharb"
+                "url": "https://github.com/sponsors/inspect-js"
             }
         },
         "node_modules/data-view-byte-offset": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz",
-            "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==",
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+            "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.6",
+                "call-bound": "^1.0.2",
                 "es-errors": "^1.3.0",
                 "is-data-view": "^1.0.1"
             },
@@ -780,9 +822,9 @@
             }
         },
         "node_modules/debug": {
-            "version": "4.3.7",
-            "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-            "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+            "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
             "dev": true,
             "dependencies": {
                 "ms": "^2.1.3"
@@ -848,58 +890,77 @@
                 "node": ">=6.0.0"
             }
         },
-        "node_modules/es-abstract": {
-            "version": "1.23.3",
-            "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz",
-            "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==",
+        "node_modules/dunder-proto": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+            "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
             "dev": true,
             "dependencies": {
-                "array-buffer-byte-length": "^1.0.1",
-                "arraybuffer.prototype.slice": "^1.0.3",
+                "call-bind-apply-helpers": "^1.0.1",
+                "es-errors": "^1.3.0",
+                "gopd": "^1.2.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/es-abstract": {
+            "version": "1.23.9",
+            "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.9.tgz",
+            "integrity": "sha512-py07lI0wjxAC/DcfK1S6G7iANonniZwTISvdPzk9hzeH0IZIshbuuFxLIU96OyF89Yb9hiqWn8M/bY83KY5vzA==",
+            "dev": true,
+            "dependencies": {
+                "array-buffer-byte-length": "^1.0.2",
+                "arraybuffer.prototype.slice": "^1.0.4",
                 "available-typed-arrays": "^1.0.7",
-                "call-bind": "^1.0.7",
-                "data-view-buffer": "^1.0.1",
-                "data-view-byte-length": "^1.0.1",
-                "data-view-byte-offset": "^1.0.0",
-                "es-define-property": "^1.0.0",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.3",
+                "data-view-buffer": "^1.0.2",
+                "data-view-byte-length": "^1.0.2",
+                "data-view-byte-offset": "^1.0.1",
+                "es-define-property": "^1.0.1",
                 "es-errors": "^1.3.0",
                 "es-object-atoms": "^1.0.0",
-                "es-set-tostringtag": "^2.0.3",
-                "es-to-primitive": "^1.2.1",
-                "function.prototype.name": "^1.1.6",
-                "get-intrinsic": "^1.2.4",
-                "get-symbol-description": "^1.0.2",
-                "globalthis": "^1.0.3",
-                "gopd": "^1.0.1",
+                "es-set-tostringtag": "^2.1.0",
+                "es-to-primitive": "^1.3.0",
+                "function.prototype.name": "^1.1.8",
+                "get-intrinsic": "^1.2.7",
+                "get-proto": "^1.0.0",
+                "get-symbol-description": "^1.1.0",
+                "globalthis": "^1.0.4",
+                "gopd": "^1.2.0",
                 "has-property-descriptors": "^1.0.2",
-                "has-proto": "^1.0.3",
-                "has-symbols": "^1.0.3",
+                "has-proto": "^1.2.0",
+                "has-symbols": "^1.1.0",
                 "hasown": "^2.0.2",
-                "internal-slot": "^1.0.7",
-                "is-array-buffer": "^3.0.4",
+                "internal-slot": "^1.1.0",
+                "is-array-buffer": "^3.0.5",
                 "is-callable": "^1.2.7",
-                "is-data-view": "^1.0.1",
-                "is-negative-zero": "^2.0.3",
-                "is-regex": "^1.1.4",
-                "is-shared-array-buffer": "^1.0.3",
-                "is-string": "^1.0.7",
-                "is-typed-array": "^1.1.13",
-                "is-weakref": "^1.0.2",
-                "object-inspect": "^1.13.1",
+                "is-data-view": "^1.0.2",
+                "is-regex": "^1.2.1",
+                "is-shared-array-buffer": "^1.0.4",
+                "is-string": "^1.1.1",
+                "is-typed-array": "^1.1.15",
+                "is-weakref": "^1.1.0",
+                "math-intrinsics": "^1.1.0",
+                "object-inspect": "^1.13.3",
                 "object-keys": "^1.1.1",
-                "object.assign": "^4.1.5",
-                "regexp.prototype.flags": "^1.5.2",
-                "safe-array-concat": "^1.1.2",
-                "safe-regex-test": "^1.0.3",
-                "string.prototype.trim": "^1.2.9",
-                "string.prototype.trimend": "^1.0.8",
+                "object.assign": "^4.1.7",
+                "own-keys": "^1.0.1",
+                "regexp.prototype.flags": "^1.5.3",
+                "safe-array-concat": "^1.1.3",
+                "safe-push-apply": "^1.0.0",
+                "safe-regex-test": "^1.1.0",
+                "set-proto": "^1.0.0",
+                "string.prototype.trim": "^1.2.10",
+                "string.prototype.trimend": "^1.0.9",
                 "string.prototype.trimstart": "^1.0.8",
-                "typed-array-buffer": "^1.0.2",
-                "typed-array-byte-length": "^1.0.1",
-                "typed-array-byte-offset": "^1.0.2",
-                "typed-array-length": "^1.0.6",
-                "unbox-primitive": "^1.0.2",
-                "which-typed-array": "^1.1.15"
+                "typed-array-buffer": "^1.0.3",
+                "typed-array-byte-length": "^1.0.3",
+                "typed-array-byte-offset": "^1.0.4",
+                "typed-array-length": "^1.0.7",
+                "unbox-primitive": "^1.1.0",
+                "which-typed-array": "^1.1.18"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -909,13 +970,10 @@
             }
         },
         "node_modules/es-define-property": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
-            "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+            "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
             "dev": true,
-            "dependencies": {
-                "get-intrinsic": "^1.2.4"
-            },
             "engines": {
                 "node": ">= 0.4"
             }
@@ -930,9 +988,9 @@
             }
         },
         "node_modules/es-object-atoms": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
-            "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+            "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
             "dev": true,
             "dependencies": {
                 "es-errors": "^1.3.0"
@@ -942,37 +1000,41 @@
             }
         },
         "node_modules/es-set-tostringtag": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
-            "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+            "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
             "dev": true,
             "dependencies": {
-                "get-intrinsic": "^1.2.4",
+                "es-errors": "^1.3.0",
+                "get-intrinsic": "^1.2.6",
                 "has-tostringtag": "^1.0.2",
-                "hasown": "^2.0.1"
+                "hasown": "^2.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
             }
         },
         "node_modules/es-shim-unscopables": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz",
-            "integrity": "sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz",
+            "integrity": "sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==",
             "dev": true,
             "dependencies": {
-                "hasown": "^2.0.0"
+                "hasown": "^2.0.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
             }
         },
         "node_modules/es-to-primitive": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
-            "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+            "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
             "dev": true,
             "dependencies": {
-                "is-callable": "^1.1.4",
-                "is-date-object": "^1.0.1",
-                "is-symbol": "^1.0.2"
+                "is-callable": "^1.2.7",
+                "is-date-object": "^1.0.5",
+                "is-symbol": "^1.0.4"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -994,16 +1056,17 @@
             }
         },
         "node_modules/eslint": {
-            "version": "8.57.0",
-            "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz",
-            "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==",
+            "version": "8.57.1",
+            "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.1.tgz",
+            "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
+            "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
             "dev": true,
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.2.0",
                 "@eslint-community/regexpp": "^4.6.1",
                 "@eslint/eslintrc": "^2.1.4",
-                "@eslint/js": "8.57.0",
-                "@humanwhocodes/config-array": "^0.11.14",
+                "@eslint/js": "8.57.1",
+                "@humanwhocodes/config-array": "^0.13.0",
                 "@humanwhocodes/module-importer": "^1.0.1",
                 "@nodelib/fs.walk": "^1.2.8",
                 "@ungap/structured-clone": "^1.2.0",
@@ -1081,9 +1144,9 @@
             }
         },
         "node_modules/eslint-module-utils": {
-            "version": "2.11.0",
-            "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.11.0.tgz",
-            "integrity": "sha512-gbBE5Hitek/oG6MUVj6sFuzEjA/ClzNflVrLovHi/JgLdC7fiN5gLAY1WIPW1a0V5I999MnsrvVrCOGmmVqDBQ==",
+            "version": "2.12.0",
+            "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.0.tgz",
+            "integrity": "sha512-wALZ0HFoytlyh/1+4wuZ9FJCD/leWHQzzrxJ8+rebyReSLk7LApMyd3WJaLVoN+D5+WIdJyDK1c6JnE65V4Zyg==",
             "dev": true,
             "dependencies": {
                 "debug": "^3.2.7"
@@ -1107,9 +1170,9 @@
             }
         },
         "node_modules/eslint-plugin-import": {
-            "version": "2.30.0",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.30.0.tgz",
-            "integrity": "sha512-/mHNE9jINJfiD2EKkg1BKyPyUk4zdnT54YgbOgfjSakWT5oyX/qQLVNTkehyfpcMxZXMy1zyonZ2v7hZTX43Yw==",
+            "version": "2.31.0",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.31.0.tgz",
+            "integrity": "sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==",
             "dev": true,
             "dependencies": {
                 "@rtsao/scc": "^1.1.0",
@@ -1120,7 +1183,7 @@
                 "debug": "^3.2.7",
                 "doctrine": "^2.1.0",
                 "eslint-import-resolver-node": "^0.3.9",
-                "eslint-module-utils": "^2.9.0",
+                "eslint-module-utils": "^2.12.0",
                 "hasown": "^2.0.2",
                 "is-core-module": "^2.15.1",
                 "is-glob": "^4.0.3",
@@ -1129,13 +1192,14 @@
                 "object.groupby": "^1.0.3",
                 "object.values": "^1.2.0",
                 "semver": "^6.3.1",
+                "string.prototype.trimend": "^1.0.8",
                 "tsconfig-paths": "^3.15.0"
             },
             "engines": {
                 "node": ">=4"
             },
             "peerDependencies": {
-                "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8"
+                "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9"
             }
         },
         "node_modules/eslint-plugin-import/node_modules/brace-expansion": {
@@ -1215,13 +1279,13 @@
             }
         },
         "node_modules/eslint-plugin-prettier": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.2.1.tgz",
-            "integrity": "sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==",
+            "version": "5.4.0",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.4.0.tgz",
+            "integrity": "sha512-BvQOvUhkVQM1i63iMETK9Hjud9QhqBnbtT1Zc642p9ynzBuCe5pybkOnvqZIBypXmMlsGcnU4HZ8sCTPfpAexA==",
             "dev": true,
             "dependencies": {
                 "prettier-linter-helpers": "^1.0.0",
-                "synckit": "^0.9.1"
+                "synckit": "^0.11.0"
             },
             "engines": {
                 "node": "^14.18.0 || >=16.0.0"
@@ -1232,7 +1296,7 @@
             "peerDependencies": {
                 "@types/eslint": ">=8.0.0",
                 "eslint": ">=8.0.0",
-                "eslint-config-prettier": "*",
+                "eslint-config-prettier": ">= 7.0.0 <10.0.0 || >=10.1.0",
                 "prettier": ">=3.0.0"
             },
             "peerDependenciesMeta": {
@@ -1366,16 +1430,16 @@
             "dev": true
         },
         "node_modules/fast-glob": {
-            "version": "3.3.2",
-            "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
-            "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
+            "version": "3.3.3",
+            "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
+            "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
             "dev": true,
             "dependencies": {
                 "@nodelib/fs.stat": "^2.0.2",
                 "@nodelib/fs.walk": "^1.2.3",
                 "glob-parent": "^5.1.2",
                 "merge2": "^1.3.0",
-                "micromatch": "^4.0.4"
+                "micromatch": "^4.0.8"
             },
             "engines": {
                 "node": ">=8.6.0"
@@ -1406,9 +1470,9 @@
             "dev": true
         },
         "node_modules/fastq": {
-            "version": "1.17.1",
-            "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
-            "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
+            "version": "1.19.1",
+            "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.19.1.tgz",
+            "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==",
             "dev": true,
             "dependencies": {
                 "reusify": "^1.0.4"
@@ -1469,18 +1533,24 @@
             }
         },
         "node_modules/flatted": {
-            "version": "3.3.1",
-            "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
-            "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
+            "version": "3.3.3",
+            "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
+            "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
             "dev": true
         },
         "node_modules/for-each": {
-            "version": "0.3.3",
-            "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
-            "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
+            "version": "0.3.5",
+            "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+            "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
             "dev": true,
             "dependencies": {
-                "is-callable": "^1.1.3"
+                "is-callable": "^1.2.7"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
             }
         },
         "node_modules/fs.realpath": {
@@ -1499,15 +1569,17 @@
             }
         },
         "node_modules/function.prototype.name": {
-            "version": "1.1.6",
-            "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz",
-            "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==",
+            "version": "1.1.8",
+            "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.8.tgz",
+            "integrity": "sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "define-properties": "^1.2.0",
-                "es-abstract": "^1.22.1",
-                "functions-have-names": "^1.2.3"
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.3",
+                "define-properties": "^1.2.1",
+                "functions-have-names": "^1.2.3",
+                "hasown": "^2.0.2",
+                "is-callable": "^1.2.7"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1526,16 +1598,21 @@
             }
         },
         "node_modules/get-intrinsic": {
-            "version": "1.2.4",
-            "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
-            "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+            "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
             "dev": true,
             "dependencies": {
+                "call-bind-apply-helpers": "^1.0.2",
+                "es-define-property": "^1.0.1",
                 "es-errors": "^1.3.0",
+                "es-object-atoms": "^1.1.1",
                 "function-bind": "^1.1.2",
-                "has-proto": "^1.0.1",
-                "has-symbols": "^1.0.3",
-                "hasown": "^2.0.0"
+                "get-proto": "^1.0.1",
+                "gopd": "^1.2.0",
+                "has-symbols": "^1.1.0",
+                "hasown": "^2.0.2",
+                "math-intrinsics": "^1.1.0"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1544,15 +1621,28 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
-        "node_modules/get-symbol-description": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
-            "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
+        "node_modules/get-proto": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+            "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.5",
+                "dunder-proto": "^1.0.1",
+                "es-object-atoms": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
+        "node_modules/get-symbol-description": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+            "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.3",
                 "es-errors": "^1.3.0",
-                "get-intrinsic": "^1.2.4"
+                "get-intrinsic": "^1.2.6"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1648,12 +1738,12 @@
             }
         },
         "node_modules/gopd": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-            "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+            "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
             "dev": true,
-            "dependencies": {
-                "get-intrinsic": "^1.1.3"
+            "engines": {
+                "node": ">= 0.4"
             },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
@@ -1666,10 +1756,13 @@
             "dev": true
         },
         "node_modules/has-bigints": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz",
-            "integrity": "sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz",
+            "integrity": "sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==",
             "dev": true,
+            "engines": {
+                "node": ">= 0.4"
+            },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
@@ -1696,10 +1789,13 @@
             }
         },
         "node_modules/has-proto": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
-            "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+            "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
             "dev": true,
+            "dependencies": {
+                "dunder-proto": "^1.0.0"
+            },
             "engines": {
                 "node": ">= 0.4"
             },
@@ -1708,9 +1804,9 @@
             }
         },
         "node_modules/has-symbols": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-            "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+            "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
             "dev": true,
             "engines": {
                 "node": ">= 0.4"
@@ -1756,9 +1852,9 @@
             }
         },
         "node_modules/import-fresh": {
-            "version": "3.3.0",
-            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
-            "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
+            "version": "3.3.1",
+            "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
+            "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
             "dev": true,
             "dependencies": {
                 "parent-module": "^1.0.0",
@@ -1798,27 +1894,47 @@
             "dev": true
         },
         "node_modules/internal-slot": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
-            "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+            "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
             "dev": true,
             "dependencies": {
                 "es-errors": "^1.3.0",
-                "hasown": "^2.0.0",
-                "side-channel": "^1.0.4"
+                "hasown": "^2.0.2",
+                "side-channel": "^1.1.0"
             },
             "engines": {
                 "node": ">= 0.4"
             }
         },
         "node_modules/is-array-buffer": {
-            "version": "3.0.4",
-            "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
-            "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
+            "version": "3.0.5",
+            "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+            "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "get-intrinsic": "^1.2.1"
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.3",
+                "get-intrinsic": "^1.2.6"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/is-async-function": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+            "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+            "dev": true,
+            "dependencies": {
+                "async-function": "^1.0.0",
+                "call-bound": "^1.0.3",
+                "get-proto": "^1.0.1",
+                "has-tostringtag": "^1.0.2",
+                "safe-regex-test": "^1.1.0"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1828,25 +1944,28 @@
             }
         },
         "node_modules/is-bigint": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
-            "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+            "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
             "dev": true,
             "dependencies": {
-                "has-bigints": "^1.0.1"
+                "has-bigints": "^1.0.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
             },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
         "node_modules/is-boolean-object": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
-            "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==",
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+            "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "has-tostringtag": "^1.0.0"
+                "call-bound": "^1.0.3",
+                "has-tostringtag": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1868,9 +1987,9 @@
             }
         },
         "node_modules/is-core-module": {
-            "version": "2.15.1",
-            "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.1.tgz",
-            "integrity": "sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==",
+            "version": "2.16.1",
+            "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
+            "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==",
             "dev": true,
             "dependencies": {
                 "hasown": "^2.0.2"
@@ -1883,11 +2002,13 @@
             }
         },
         "node_modules/is-data-view": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz",
-            "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==",
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+            "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
             "dev": true,
             "dependencies": {
+                "call-bound": "^1.0.2",
+                "get-intrinsic": "^1.2.6",
                 "is-typed-array": "^1.1.13"
             },
             "engines": {
@@ -1898,12 +2019,13 @@
             }
         },
         "node_modules/is-date-object": {
-            "version": "1.0.5",
-            "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz",
-            "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+            "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
             "dev": true,
             "dependencies": {
-                "has-tostringtag": "^1.0.0"
+                "call-bound": "^1.0.2",
+                "has-tostringtag": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1921,6 +2043,39 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/is-finalizationregistry": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+            "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/is-generator-function": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.0.tgz",
+            "integrity": "sha512-nPUB5km40q9e8UfN/Zc24eLlzdSf9OfKByBw9CIdw4H1giPMeA0OIJvbchsCu4npfI2QcMVBsGEBHKZ7wLTWmQ==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.3",
+                "get-proto": "^1.0.0",
+                "has-tostringtag": "^1.0.2",
+                "safe-regex-test": "^1.1.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
         "node_modules/is-glob": {
             "version": "4.0.3",
             "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -1933,10 +2088,10 @@
                 "node": ">=0.10.0"
             }
         },
-        "node_modules/is-negative-zero": {
+        "node_modules/is-map": {
             "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
-            "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
+            "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+            "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
             "dev": true,
             "engines": {
                 "node": ">= 0.4"
@@ -1955,12 +2110,13 @@
             }
         },
         "node_modules/is-number-object": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
-            "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+            "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
             "dev": true,
             "dependencies": {
-                "has-tostringtag": "^1.0.0"
+                "call-bound": "^1.0.3",
+                "has-tostringtag": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1979,13 +2135,15 @@
             }
         },
         "node_modules/is-regex": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz",
-            "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==",
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
+            "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
-                "has-tostringtag": "^1.0.0"
+                "call-bound": "^1.0.2",
+                "gopd": "^1.2.0",
+                "has-tostringtag": "^1.0.2",
+                "hasown": "^2.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -1994,13 +2152,25 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
+        "node_modules/is-set": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+            "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
         "node_modules/is-shared-array-buffer": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
-            "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+            "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7"
+                "call-bound": "^1.0.3"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2010,12 +2180,13 @@
             }
         },
         "node_modules/is-string": {
-            "version": "1.0.7",
-            "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz",
-            "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+            "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
             "dev": true,
             "dependencies": {
-                "has-tostringtag": "^1.0.0"
+                "call-bound": "^1.0.3",
+                "has-tostringtag": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2025,12 +2196,14 @@
             }
         },
         "node_modules/is-symbol": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz",
-            "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+            "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
             "dev": true,
             "dependencies": {
-                "has-symbols": "^1.0.2"
+                "call-bound": "^1.0.2",
+                "has-symbols": "^1.1.0",
+                "safe-regex-test": "^1.1.0"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2040,12 +2213,12 @@
             }
         },
         "node_modules/is-typed-array": {
-            "version": "1.1.13",
-            "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
-            "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
+            "version": "1.1.15",
+            "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+            "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
             "dev": true,
             "dependencies": {
-                "which-typed-array": "^1.1.14"
+                "which-typed-array": "^1.1.16"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2054,13 +2227,44 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
+        "node_modules/is-weakmap": {
+            "version": "2.0.2",
+            "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+            "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
         "node_modules/is-weakref": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz",
-            "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+            "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2"
+                "call-bound": "^1.0.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/is-weakset": {
+            "version": "2.0.4",
+            "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+            "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.3",
+                "get-intrinsic": "^1.2.6"
+            },
+            "engines": {
+                "node": ">= 0.4"
             },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
@@ -2163,6 +2367,15 @@
             "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
             "dev": true
         },
+        "node_modules/math-intrinsics": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+            "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+            "dev": true,
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
         "node_modules/merge2": {
             "version": "1.4.1",
             "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -2222,9 +2435,9 @@
             "dev": true
         },
         "node_modules/object-inspect": {
-            "version": "1.13.2",
-            "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz",
-            "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==",
+            "version": "1.13.4",
+            "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+            "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
             "dev": true,
             "engines": {
                 "node": ">= 0.4"
@@ -2243,14 +2456,16 @@
             }
         },
         "node_modules/object.assign": {
-            "version": "4.1.5",
-            "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz",
-            "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==",
+            "version": "4.1.7",
+            "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+            "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.5",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.3",
                 "define-properties": "^1.2.1",
-                "has-symbols": "^1.0.3",
+                "es-object-atoms": "^1.0.0",
+                "has-symbols": "^1.1.0",
                 "object-keys": "^1.1.1"
             },
             "engines": {
@@ -2293,12 +2508,13 @@
             }
         },
         "node_modules/object.values": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz",
-            "integrity": "sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==",
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.1.tgz",
+            "integrity": "sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.3",
                 "define-properties": "^1.2.1",
                 "es-object-atoms": "^1.0.0"
             },
@@ -2335,6 +2551,23 @@
                 "node": ">= 0.8.0"
             }
         },
+        "node_modules/own-keys": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+            "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+            "dev": true,
+            "dependencies": {
+                "get-intrinsic": "^1.2.6",
+                "object-keys": "^1.1.1",
+                "safe-push-apply": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
         "node_modules/p-limit": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -2423,9 +2656,9 @@
             }
         },
         "node_modules/possible-typed-array-names": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz",
-            "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
+            "integrity": "sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==",
             "dev": true,
             "engines": {
                 "node": ">= 0.4"
@@ -2441,9 +2674,9 @@
             }
         },
         "node_modules/prettier": {
-            "version": "3.3.3",
-            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
-            "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
+            "version": "3.5.3",
+            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz",
+            "integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==",
             "dev": true,
             "bin": {
                 "prettier": "bin/prettier.cjs"
@@ -2496,16 +2729,40 @@
                 }
             ]
         },
-        "node_modules/regexp.prototype.flags": {
-            "version": "1.5.2",
-            "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
-            "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
+        "node_modules/reflect.getprototypeof": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+            "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.6",
+                "call-bind": "^1.0.8",
+                "define-properties": "^1.2.1",
+                "es-abstract": "^1.23.9",
+                "es-errors": "^1.3.0",
+                "es-object-atoms": "^1.0.0",
+                "get-intrinsic": "^1.2.7",
+                "get-proto": "^1.0.1",
+                "which-builtin-type": "^1.2.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/regexp.prototype.flags": {
+            "version": "1.5.4",
+            "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+            "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
+            "dev": true,
+            "dependencies": {
+                "call-bind": "^1.0.8",
                 "define-properties": "^1.2.1",
                 "es-errors": "^1.3.0",
-                "set-function-name": "^2.0.1"
+                "get-proto": "^1.0.1",
+                "gopd": "^1.2.0",
+                "set-function-name": "^2.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2515,18 +2772,21 @@
             }
         },
         "node_modules/resolve": {
-            "version": "1.22.8",
-            "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
-            "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
+            "version": "1.22.10",
+            "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
+            "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",
             "dev": true,
             "dependencies": {
-                "is-core-module": "^2.13.0",
+                "is-core-module": "^2.16.0",
                 "path-parse": "^1.0.7",
                 "supports-preserve-symlinks-flag": "^1.0.0"
             },
             "bin": {
                 "resolve": "bin/resolve"
             },
+            "engines": {
+                "node": ">= 0.4"
+            },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
@@ -2541,9 +2801,9 @@
             }
         },
         "node_modules/reusify": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
-            "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz",
+            "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==",
             "dev": true,
             "engines": {
                 "iojs": ">=1.0.0",
@@ -2590,14 +2850,15 @@
             }
         },
         "node_modules/safe-array-concat": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
-            "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
+            "integrity": "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
-                "get-intrinsic": "^1.2.4",
-                "has-symbols": "^1.0.3",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.2",
+                "get-intrinsic": "^1.2.6",
+                "has-symbols": "^1.1.0",
                 "isarray": "^2.0.5"
             },
             "engines": {
@@ -2607,15 +2868,31 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
-        "node_modules/safe-regex-test": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
-            "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
+        "node_modules/safe-push-apply": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+            "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.6",
                 "es-errors": "^1.3.0",
-                "is-regex": "^1.1.4"
+                "isarray": "^2.0.5"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/safe-regex-test": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
+            "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.2",
+                "es-errors": "^1.3.0",
+                "is-regex": "^1.2.1"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2625,9 +2902,9 @@
             }
         },
         "node_modules/semver": {
-            "version": "7.6.3",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+            "version": "7.7.1",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
+            "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -2668,6 +2945,20 @@
                 "node": ">= 0.4"
             }
         },
+        "node_modules/set-proto": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+            "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+            "dev": true,
+            "dependencies": {
+                "dunder-proto": "^1.0.1",
+                "es-errors": "^1.3.0",
+                "es-object-atoms": "^1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            }
+        },
         "node_modules/shebang-command": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -2690,15 +2981,69 @@
             }
         },
         "node_modules/side-channel": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
-            "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+            "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
                 "es-errors": "^1.3.0",
-                "get-intrinsic": "^1.2.4",
-                "object-inspect": "^1.13.1"
+                "object-inspect": "^1.13.3",
+                "side-channel-list": "^1.0.0",
+                "side-channel-map": "^1.0.1",
+                "side-channel-weakmap": "^1.0.2"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/side-channel-list": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
+            "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
+            "dev": true,
+            "dependencies": {
+                "es-errors": "^1.3.0",
+                "object-inspect": "^1.13.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/side-channel-map": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+            "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.2",
+                "es-errors": "^1.3.0",
+                "get-intrinsic": "^1.2.5",
+                "object-inspect": "^1.13.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/side-channel-weakmap": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+            "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.2",
+                "es-errors": "^1.3.0",
+                "get-intrinsic": "^1.2.5",
+                "object-inspect": "^1.13.3",
+                "side-channel-map": "^1.0.1"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2708,15 +3053,18 @@
             }
         },
         "node_modules/string.prototype.trim": {
-            "version": "1.2.9",
-            "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
-            "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==",
+            "version": "1.2.10",
+            "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz",
+            "integrity": "sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.2",
+                "define-data-property": "^1.1.4",
                 "define-properties": "^1.2.1",
-                "es-abstract": "^1.23.0",
-                "es-object-atoms": "^1.0.0"
+                "es-abstract": "^1.23.5",
+                "es-object-atoms": "^1.0.0",
+                "has-property-descriptors": "^1.0.2"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2726,15 +3074,19 @@
             }
         },
         "node_modules/string.prototype.trimend": {
-            "version": "1.0.8",
-            "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz",
-            "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==",
+            "version": "1.0.9",
+            "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz",
+            "integrity": "sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.2",
                 "define-properties": "^1.2.1",
                 "es-object-atoms": "^1.0.0"
             },
+            "engines": {
+                "node": ">= 0.4"
+            },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
@@ -2814,19 +3166,19 @@
             }
         },
         "node_modules/synckit": {
-            "version": "0.9.1",
-            "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.9.1.tgz",
-            "integrity": "sha512-7gr8p9TQP6RAHusBOSLs46F4564ZrjV8xFmw5zCmgmhGUcw2hxsShhJ6CEiHQMgPDwAQ1fWHPM0ypc4RMAig4A==",
+            "version": "0.11.4",
+            "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.11.4.tgz",
+            "integrity": "sha512-Q/XQKRaJiLiFIBNN+mndW7S/RHxvwzuZS6ZwmRzUBqJBv/5QIKCEwkBC8GBf8EQJKYnaFs0wOZbKTXBPj8L9oQ==",
             "dev": true,
             "dependencies": {
-                "@pkgr/core": "^0.1.0",
-                "tslib": "^2.6.2"
+                "@pkgr/core": "^0.2.3",
+                "tslib": "^2.8.1"
             },
             "engines": {
                 "node": "^14.18.0 || >=16.0.0"
             },
             "funding": {
-                "url": "https://opencollective.com/unts"
+                "url": "https://opencollective.com/synckit"
             }
         },
         "node_modules/text-table": {
@@ -2848,15 +3200,15 @@
             }
         },
         "node_modules/ts-api-utils": {
-            "version": "1.3.0",
-            "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.3.0.tgz",
-            "integrity": "sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==",
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+            "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
             "dev": true,
             "engines": {
-                "node": ">=16"
+                "node": ">=18.12"
             },
             "peerDependencies": {
-                "typescript": ">=4.2.0"
+                "typescript": ">=4.8.4"
             }
         },
         "node_modules/tsconfig-paths": {
@@ -2874,9 +3226,9 @@
             }
         },
         "node_modules/tslib": {
-            "version": "2.7.0",
-            "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.7.0.tgz",
-            "integrity": "sha512-gLXCKdN1/j47AiHiOkJN69hJmcbGTHI0ImLmbYLHykhgeN0jVGola9yVjFgzCUklsZQMW55o+dW7IXv3RCXDzA==",
+            "version": "2.8.1",
+            "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+            "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
             "dev": true
         },
         "node_modules/type-check": {
@@ -2904,30 +3256,30 @@
             }
         },
         "node_modules/typed-array-buffer": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
-            "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+            "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bound": "^1.0.3",
                 "es-errors": "^1.3.0",
-                "is-typed-array": "^1.1.13"
+                "is-typed-array": "^1.1.14"
             },
             "engines": {
                 "node": ">= 0.4"
             }
         },
         "node_modules/typed-array-byte-length": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
-            "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+            "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
                 "for-each": "^0.3.3",
-                "gopd": "^1.0.1",
-                "has-proto": "^1.0.3",
-                "is-typed-array": "^1.1.13"
+                "gopd": "^1.2.0",
+                "has-proto": "^1.2.0",
+                "is-typed-array": "^1.1.14"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2937,17 +3289,18 @@
             }
         },
         "node_modules/typed-array-byte-offset": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
-            "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+            "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
             "dev": true,
             "dependencies": {
                 "available-typed-arrays": "^1.0.7",
-                "call-bind": "^1.0.7",
+                "call-bind": "^1.0.8",
                 "for-each": "^0.3.3",
-                "gopd": "^1.0.1",
-                "has-proto": "^1.0.3",
-                "is-typed-array": "^1.1.13"
+                "gopd": "^1.2.0",
+                "has-proto": "^1.2.0",
+                "is-typed-array": "^1.1.15",
+                "reflect.getprototypeof": "^1.0.9"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2957,17 +3310,17 @@
             }
         },
         "node_modules/typed-array-length": {
-            "version": "1.0.6",
-            "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz",
-            "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==",
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.7.tgz",
+            "integrity": "sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==",
             "dev": true,
             "dependencies": {
                 "call-bind": "^1.0.7",
                 "for-each": "^0.3.3",
                 "gopd": "^1.0.1",
-                "has-proto": "^1.0.3",
                 "is-typed-array": "^1.1.13",
-                "possible-typed-array-names": "^1.0.0"
+                "possible-typed-array-names": "^1.0.0",
+                "reflect.getprototypeof": "^1.0.6"
             },
             "engines": {
                 "node": ">= 0.4"
@@ -2977,9 +3330,9 @@
             }
         },
         "node_modules/typescript": {
-            "version": "5.6.2",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.2.tgz",
-            "integrity": "sha512-NW8ByodCSNCwZeghjN3o+JX5OFH0Ojg6sadjEKY4huZ52TqbJTJnDo5+Tw98lSy63NZvi4n+ez5m2u5d4PkZyw==",
+            "version": "5.7.3",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz",
+            "integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==",
             "dev": true,
             "bin": {
                 "tsc": "bin/tsc",
@@ -2990,24 +3343,27 @@
             }
         },
         "node_modules/unbox-primitive": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz",
-            "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==",
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+            "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
             "dev": true,
             "dependencies": {
-                "call-bind": "^1.0.2",
+                "call-bound": "^1.0.3",
                 "has-bigints": "^1.0.2",
-                "has-symbols": "^1.0.3",
-                "which-boxed-primitive": "^1.0.2"
+                "has-symbols": "^1.1.0",
+                "which-boxed-primitive": "^1.1.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
             },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
         "node_modules/undici-types": {
-            "version": "6.19.8",
-            "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz",
-            "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==",
+            "version": "6.21.0",
+            "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
+            "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
             "dev": true
         },
         "node_modules/uri-js": {
@@ -3035,31 +3391,81 @@
             }
         },
         "node_modules/which-boxed-primitive": {
-            "version": "1.0.2",
-            "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz",
-            "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==",
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+            "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
             "dev": true,
             "dependencies": {
-                "is-bigint": "^1.0.1",
-                "is-boolean-object": "^1.1.0",
-                "is-number-object": "^1.0.4",
-                "is-string": "^1.0.5",
-                "is-symbol": "^1.0.3"
+                "is-bigint": "^1.1.0",
+                "is-boolean-object": "^1.2.1",
+                "is-number-object": "^1.1.1",
+                "is-string": "^1.1.1",
+                "is-symbol": "^1.1.1"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/which-builtin-type": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+            "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
+            "dev": true,
+            "dependencies": {
+                "call-bound": "^1.0.2",
+                "function.prototype.name": "^1.1.6",
+                "has-tostringtag": "^1.0.2",
+                "is-async-function": "^2.0.0",
+                "is-date-object": "^1.1.0",
+                "is-finalizationregistry": "^1.1.0",
+                "is-generator-function": "^1.0.10",
+                "is-regex": "^1.2.1",
+                "is-weakref": "^1.0.2",
+                "isarray": "^2.0.5",
+                "which-boxed-primitive": "^1.1.0",
+                "which-collection": "^1.0.2",
+                "which-typed-array": "^1.1.16"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/which-collection": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+            "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
+            "dev": true,
+            "dependencies": {
+                "is-map": "^2.0.3",
+                "is-set": "^2.0.3",
+                "is-weakmap": "^2.0.2",
+                "is-weakset": "^2.0.3"
+            },
+            "engines": {
+                "node": ">= 0.4"
             },
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
         "node_modules/which-typed-array": {
-            "version": "1.1.15",
-            "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz",
-            "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==",
+            "version": "1.1.19",
+            "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.19.tgz",
+            "integrity": "sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==",
             "dev": true,
             "dependencies": {
                 "available-typed-arrays": "^1.0.7",
-                "call-bind": "^1.0.7",
-                "for-each": "^0.3.3",
-                "gopd": "^1.0.1",
+                "call-bind": "^1.0.8",
+                "call-bound": "^1.0.4",
+                "for-each": "^0.3.5",
+                "get-proto": "^1.0.1",
+                "gopd": "^1.2.0",
                 "has-tostringtag": "^1.0.2"
             },
             "engines": {
diff --git a/package.json b/package.json
index 86710f5..f91aa79 100644
--- a/package.json
+++ b/package.json
@@ -4,8 +4,8 @@
     "description": "A customizable panel built for Hyprland.",
     "main": "app.ts",
     "scripts": {
-        "lint": "eslint --config .eslintrc.js .",
-        "lint:fix": "eslint --config .eslintrc.js . --fix",
+        "lint": "eslint --config .eslintrc.json .",
+        "lint:fix": "eslint --config .eslintrc.json . --fix",
         "format": "prettier --write 'modules/**/*.ts'"
     },
     "keywords": [],
@@ -24,6 +24,6 @@
         "eslint-plugin-prettier": "^5.2.1",
         "prettier": "^3.3.3",
         "tsconfig-paths": "^4.2.0",
-        "typescript": "^5.6.2"
+        "typescript": "5.7.3"
     }
 }
diff --git a/scripts/makeTheme.ts b/scripts/makeTheme.ts
old mode 100644
new mode 100755
index 193c9c9..7bddc51
--- a/scripts/makeTheme.ts
+++ b/scripts/makeTheme.ts
@@ -21,179 +21,181 @@
  *   ts-node makeTheme.ts theme.json updatedTheme.json --vivid
  */
 
-const fs = require('fs');
-const path = require('path');
+(() => {
+    const fs = require('fs');
+    const path = require('path');
 
-/**
- * Prints the usage/help text.
- */
-function printUsage(): void {
-    console.log(`
-Usage:
-  ts-node makeTheme.ts <input.json> <output.json> [--vivid | --base | --both]
+    /**
+     * Prints the usage/help text.
+     */
+    function printUsage(): void {
+        console.log(`
+  Usage:
+    ts-node makeTheme.ts <input.json> <output.json> [--vivid | --base | --both]
 
-Options:
-  --help   Show this help message
+  Options:
+    --help   Show this help message
 
-Transforms:
-  --vivid  Swap .background with .text (or .total), set .icon = old background
-  --base   Set .icon = .text (or .total), leave .background alone
-  --both   Apply makeVividTheme, then makeBaseTheme
-`);
-}
-
-/**
- * Reads a file as UTF-8 and returns a parsed JSON object.
- */
-async function readJson(filePath: string): Promise<Record<string, unknown>> {
-    const raw = await fs.promises.readFile(path.resolve(filePath), 'utf8');
-    return JSON.parse(raw) as Record<string, unknown>;
-}
-
-/**
- * Executes the "vivid" transformation on the input data.
- * For each key matching "theme.bar.buttons.*":
- *   - If it has .background and .text (or .total), swap them.
- *   - Set .icon to the old background.
- */
-function makeVividTheme(data: Record<string, unknown>): void {
-    data['theme.bar.buttons.style'] = 'default';
-
-    const prefix = 'theme.bar.buttons.';
-    const grouped: Record<string, Record<string, unknown>> = {};
-
-    for (const key of Object.keys(data)) {
-        if (!key.startsWith(prefix)) continue;
-
-        // Split: ["theme", "bar", "buttons", ...theRest]
-        const parts = key.split('.');
-        const rest = parts.slice(3);
-        if (rest.length < 2) continue; // need at least <name> and <prop>
-
-        // Last segment is the property (e.g. "text", "background")
-        // The rest form the "name" (e.g. "modules.updates")
-        const prop = rest.pop()!;
-        const name = rest.join('.');
-
-        if (!grouped[name]) grouped[name] = {};
-        grouped[name][prop] = data[key];
+  Transforms:
+    --vivid  Swap .background with .text (or .total), set .icon = old background
+    --base   Set .icon = .text (or .total), leave .background alone
+    --both   Apply makeVividTheme, then makeBaseTheme
+  `);
     }
 
-    for (const name of Object.keys(grouped)) {
-        const props = grouped[name];
-        const hasBg = Object.prototype.hasOwnProperty.call(props, 'background');
-        const hasTxt = Object.prototype.hasOwnProperty.call(props, 'text');
-        const hasTot = Object.prototype.hasOwnProperty.call(props, 'total');
-        if (!hasBg || (!hasTxt && !hasTot)) continue;
-
-        const oldBackground = props['background'];
-        let textKey: 'text' | 'total' | undefined;
-        if (hasTxt) textKey = 'text';
-        else if (hasTot) textKey = 'total';
-        if (!textKey) continue;
-
-        const oldText = props[textKey];
-        props[textKey] = oldBackground;
-        props['icon'] = oldBackground;
-        props['background'] = oldText;
+    /**
+     * Reads a file as UTF-8 and returns a parsed JSON object.
+     */
+    async function readJson(filePath: string): Promise<Record<string, unknown>> {
+        const raw = await fs.promises.readFile(path.resolve(filePath), 'utf8');
+        return JSON.parse(raw);
     }
 
-    // Write the changes back to the original data
-    for (const name of Object.keys(grouped)) {
-        for (const prop of Object.keys(grouped[name])) {
-            const fullKey = prefix + name + '.' + prop;
-            data[fullKey] = grouped[name][prop];
+    /**
+     * Executes the "vivid" transformation on the input data.
+     * For each key matching "theme.bar.buttons.*":
+     *   - If it has .background and .text (or .total), swap them.
+     *   - Set .icon to the old background.
+     */
+    function makeVividTheme(data: Record<string, unknown>): void {
+        data['theme.bar.buttons.style'] = 'default';
+
+        const prefix = 'theme.bar.buttons.';
+        const grouped: Record<string, Record<string, unknown>> = {};
+
+        for (const key of Object.keys(data)) {
+            if (!key.startsWith(prefix)) continue;
+
+            // Split: ["theme", "bar", "buttons", ...theRest]
+            const parts = key.split('.');
+            const rest = parts.slice(3);
+            if (rest.length < 2) continue; // need at least <name> and <prop>
+
+            // Last segment is the property (e.g. "text", "background")
+            // The rest form the "name" (e.g. "modules.updates")
+            const prop = rest.pop()!;
+            const name = rest.join('.');
+
+            if (!grouped[name]) grouped[name] = {};
+            grouped[name][prop] = data[key];
+        }
+
+        for (const name of Object.keys(grouped)) {
+            const props = grouped[name];
+            const hasBg = Object.prototype.hasOwnProperty.call(props, 'background');
+            const hasTxt = Object.prototype.hasOwnProperty.call(props, 'text');
+            const hasTot = Object.prototype.hasOwnProperty.call(props, 'total');
+            if (!hasBg || (!hasTxt && !hasTot)) continue;
+
+            const oldBackground = props['background'];
+            let textKey: 'text' | 'total' | undefined;
+            if (hasTxt) textKey = 'text';
+            else if (hasTot) textKey = 'total';
+            if (!textKey) continue;
+
+            const oldText = props[textKey];
+            props[textKey] = oldBackground;
+            props['icon'] = oldBackground;
+            props['background'] = oldText;
+        }
+
+        // Write the changes back to the original data
+        for (const name of Object.keys(grouped)) {
+            for (const prop of Object.keys(grouped[name])) {
+                const fullKey = prefix + name + '.' + prop;
+                data[fullKey] = grouped[name][prop];
+            }
         }
     }
-}
 
-/**
- * Executes the "base" transformation on the input data.
- * For each key matching "theme.bar.buttons.*":
- *   - If it has .text or .total, set .icon to that value.
- *   - Leave .background alone.
- */
-function makeBaseTheme(data: Record<string, unknown>): void {
-    data['theme.bar.buttons.style'] = 'default';
+    /**
+     * Executes the "base" transformation on the input data.
+     * For each key matching "theme.bar.buttons.*":
+     *   - If it has .text or .total, set .icon to that value.
+     *   - Leave .background alone.
+     */
+    function makeBaseTheme(data: Record<string, unknown>): void {
+        data['theme.bar.buttons.style'] = 'default';
 
-    const prefix = 'theme.bar.buttons.';
-    const grouped: Record<string, Record<string, unknown>> = {};
+        const prefix = 'theme.bar.buttons.';
+        const grouped: Record<string, Record<string, unknown>> = {};
 
-    for (const key of Object.keys(data)) {
-        if (!key.startsWith(prefix)) continue;
+        for (const key of Object.keys(data)) {
+            if (!key.startsWith(prefix)) continue;
 
-        const parts = key.split('.');
-        const rest = parts.slice(3);
-        if (rest.length < 2) continue;
+            const parts = key.split('.');
+            const rest = parts.slice(3);
+            if (rest.length < 2) continue;
 
-        const prop = rest.pop()!;
-        const name = rest.join('.');
-        if (!grouped[name]) grouped[name] = {};
-        grouped[name][prop] = data[key];
-    }
+            const prop = rest.pop()!;
+            const name = rest.join('.');
+            if (!grouped[name]) grouped[name] = {};
+            grouped[name][prop] = data[key];
+        }
 
-    for (const name of Object.keys(grouped)) {
-        const props = grouped[name];
-        const hasTxt = Object.prototype.hasOwnProperty.call(props, 'text');
-        const hasTot = Object.prototype.hasOwnProperty.call(props, 'total');
-        if (!hasTxt && !hasTot) continue;
+        for (const name of Object.keys(grouped)) {
+            const props = grouped[name];
+            const hasTxt = Object.prototype.hasOwnProperty.call(props, 'text');
+            const hasTot = Object.prototype.hasOwnProperty.call(props, 'total');
+            if (!hasTxt && !hasTot) continue;
 
-        const value = hasTxt ? props['text'] : props['total'];
-        props['icon'] = value;
-    }
+            const value = hasTxt ? props['text'] : props['total'];
+            props['icon'] = value;
+        }
 
-    for (const name of Object.keys(grouped)) {
-        for (const prop of Object.keys(grouped[name])) {
-            const fullKey = prefix + name + '.' + prop;
-            data[fullKey] = grouped[name][prop];
+        for (const name of Object.keys(grouped)) {
+            for (const prop of Object.keys(grouped[name])) {
+                const fullKey = prefix + name + '.' + prop;
+                data[fullKey] = grouped[name][prop];
+            }
         }
     }
-}
 
-/**
- * Main CLI entry point.
- */
-async function main(): Promise<void> {
-    const [, , ...args] = process.argv;
-    if (args.includes('--help') || args.length < 2) {
-        printUsage();
-        process.exit(0);
+    /**
+     * Main CLI entry point.
+     */
+    async function main(): Promise<void> {
+        const [, , ...args] = process.argv;
+        if (args.includes('--help') || args.length < 2) {
+            printUsage();
+            process.exit(0);
+        }
+
+        const input = args[0];
+        const output = args[1];
+        const mode = args[2] || '--vivid';
+
+        let data: Record<string, unknown>;
+        try {
+            data = await readJson(input);
+        } catch (e) {
+            console.error(`Failed to read/parse: ${input}`, e);
+            process.exit(1);
+        }
+
+        if (mode === '--vivid') makeVividTheme(data);
+        else if (mode === '--base') makeBaseTheme(data);
+        else if (mode === '--both') {
+            makeVividTheme(data);
+            makeBaseTheme(data);
+        } else {
+            console.error(`Unknown mode: ${mode}`);
+            process.exit(1);
+        }
+
+        try {
+            fs.writeFileSync(path.resolve(output), JSON.stringify(data, null, 2), 'utf8');
+            console.log(`Wrote updated theme to: ${output}`);
+        } catch (e) {
+            console.error(`Failed to write file: ${output}`, e);
+            process.exit(1);
+        }
     }
 
-    const input = args[0];
-    const output = args[1];
-    const mode = args[2] || '--vivid';
-
-    let data: Record<string, unknown>;
-    try {
-        data = await readJson(input);
-    } catch (e) {
-        console.error(`Failed to read/parse: ${input}`, e);
-        process.exit(1);
+    if (require.main === module) {
+        main().catch((e) => {
+            console.error(e);
+            process.exit(1);
+        });
     }
-
-    if (mode === '--vivid') makeVividTheme(data);
-    else if (mode === '--base') makeBaseTheme(data);
-    else if (mode === '--both') {
-        makeVividTheme(data);
-        makeBaseTheme(data);
-    } else {
-        console.error(`Unknown mode: ${mode}`);
-        process.exit(1);
-    }
-
-    try {
-        fs.writeFileSync(path.resolve(output), JSON.stringify(data, null, 2), 'utf8');
-        console.log(`Wrote updated theme to: ${output}`);
-    } catch (e) {
-        console.error(`Failed to write file: ${output}`, e);
-        process.exit(1);
-    }
-}
-
-if (require.main === module) {
-    main().catch((e) => {
-        console.error(e);
-        process.exit(1);
-    });
-}
+})();
diff --git a/scripts/replaceColors.ts b/scripts/replaceColors.ts
index cdbb752..902b2ef 100644
--- a/scripts/replaceColors.ts
+++ b/scripts/replaceColors.ts
@@ -1,176 +1,178 @@
 #!/usr/bin/env ts-node
 /// <reference types="node" />
 
-/**
- * Prints usage/help information to the console.
- * Called whenever the user passes `--help` or when arguments are missing/invalid.
- */
-function printUsage(): void {
-    console.log(`
-Usage:
-  ts-node updateColors.ts <theme.json> <original_palette.json> <new_palette.json> <output.json>
+(() => {
+    /**
+     * Prints usage/help information to the console.
+     * Called whenever the user passes `--help` or when arguments are missing/invalid.
+     */
+    function printUsage(): void {
+        console.log(`
+  Usage:
+    ts-node updateColors.ts <theme.json> <original_palette.json> <new_palette.json> <output.json>
 
-Options:
-  --help   Show this help message
+  Options:
+    --help   Show this help message
 
-Description:
-  This script reads a theme JSON file containing old color codes, an "original" palette JSON
-  (which maps color name → old hex code), and a "new" palette JSON (mapping the same color name
-  → new hex code). It then replaces all old hex codes in the theme with the corresponding new hex codes,
-  and saves the result to the specified output JSON file.
+  Description:
+    This script reads a theme JSON file containing old color codes, an "original" palette JSON
+    (which maps color name → old hex code), and a "new" palette JSON (mapping the same color name
+    → new hex code). It then replaces all old hex codes in the theme with the corresponding new hex codes,
+    and saves the result to the specified output JSON file.
 
-Examples:
-  ts-node updateColors.ts theme.json original_palette.json new_palette.json updated_theme.json
+  Examples:
+    ts-node updateColors.ts theme.json original_palette.json new_palette.json updated_theme.json
 
-  node updateColors.js theme.json original_palette.json new_palette.json updated_theme.json
-`);
-}
+    node updateColors.js theme.json original_palette.json new_palette.json updated_theme.json
+  `);
+    }
 
-/**
- * Recursively walks a palette to build a map from old hex → new hex,
- * keyed by the same property name in the new palette if it exists.
- *
- * Example:
- *    originalPalette = { bg: "#24283b", git: { add: "#449dab" } }
- *    newPalette      = { bg: "#222436", git: { add: "#b8db87" } }
- *
- * => colorMap = {
- *      "#24283b": "#222436",
- *      "#449dab": "#b8db87"
- *    }
- *
- * @param original - The "old" palette.
- * @param updated - The "new" palette containing updated hex codes.
- * @returns A map of { oldHex.toLowerCase(): newHex }.
- */
-function buildColorMap(original: Palette, updated: Palette): ColorMap {
-    const map: ColorMap = {};
+    type Palette = Record<string, string | Record<string, string>>;
+    type ColorMap = Record<string, string>;
 
-    for (const [key, oldVal] of Object.entries(original)) {
-        const newVal = updated[key];
+    /**
+     * Recursively walks a palette to build a map from old hex → new hex,
+     * keyed by the same property name in the new palette if it exists.
+     *
+     * Example:
+     *    originalPalette = { bg: "#24283b", git: { add: "#449dab" } }
+     *    newPalette      = { bg: "#222436", git: { add: "#b8db87" } }
+     *
+     * => colorMap = {
+     *      "#24283b": "#222436",
+     *      "#449dab": "#b8db87"
+     *    }
+     *
+     * @param original - The "old" palette.
+     * @param updated - The "new" palette containing updated hex codes.
+     * @returns A map of { oldHex.toLowerCase(): newHex }.
+     */
+    function buildColorMap(original: Palette, updated: Palette): ColorMap {
+        const map: ColorMap = {};
 
-        if (typeof oldVal === 'string' && typeof newVal === 'string') {
-            map[oldVal.toLowerCase()] = newVal;
-        } else if (oldVal && typeof oldVal === 'object') {
-            const oldNested = oldVal as Record<string, string>;
-            const newNested = newVal && typeof newVal === 'object' ? (newVal as Record<string, string>) : {};
+        for (const [key, oldVal] of Object.entries(original)) {
+            const newVal = updated[key];
 
-            for (const [nestedKey, nestedOldHex] of Object.entries(oldNested)) {
-                const nestedNewHex = newNested[nestedKey];
+            if (typeof oldVal === 'string' && typeof newVal === 'string') {
+                map[oldVal.toLowerCase()] = newVal;
+            } else if (oldVal && typeof oldVal === 'object') {
+                const oldNested = oldVal as Record<string, string>;
+                const newNested =
+                    newVal && typeof newVal === 'object' ? (newVal as Record<string, string>) : {};
 
-                if (typeof nestedOldHex === 'string' && typeof nestedNewHex === 'string') {
-                    map[nestedOldHex.toLowerCase()] = nestedNewHex;
+                for (const [nestedKey, nestedOldHex] of Object.entries(oldNested)) {
+                    const nestedNewHex = newNested[nestedKey];
+
+                    if (typeof nestedOldHex === 'string' && typeof nestedNewHex === 'string') {
+                        map[nestedOldHex.toLowerCase()] = nestedNewHex;
+                    }
                 }
             }
         }
+
+        return map;
     }
 
-    return map;
-}
+    /**
+     * Recursively replace all string values in a data structure (object, array, etc.)
+     * if they appear in colorMap.
+     *
+     * @param node - The current portion of JSON to transform (can be object, array, string, etc.).
+     * @param colorMap - An object with oldHex.toLowerCase() → newHex mappings.
+     * @returns The transformed data with replaced colors.
+     */
+    function replaceColorsInTheme(node: unknown, colorMap: ColorMap): unknown {
+        if (Array.isArray(node)) {
+            return node.map((item) => replaceColorsInTheme(item, colorMap));
+        } else if (node && typeof node === 'object') {
+            const result: Record<string, unknown> = {};
 
-/**
- * Recursively replace all string values in a data structure (object, array, etc.)
- * if they appear in colorMap.
- *
- * @param node - The current portion of JSON to transform (can be object, array, string, etc.).
- * @param colorMap - An object with oldHex.toLowerCase() → newHex mappings.
- * @returns The transformed data with replaced colors.
- */
-function replaceColorsInTheme(node: unknown, colorMap: ColorMap): unknown {
-    if (Array.isArray(node)) {
-        return node.map((item) => replaceColorsInTheme(item, colorMap));
-    } else if (node && typeof node === 'object') {
-        const result: Record<string, unknown> = {};
-
-        for (const [key, val] of Object.entries(node)) {
-            result[key] = replaceColorsInTheme(val, colorMap);
-        }
-        return result;
-    } else if (typeof node === 'string') {
-        const lower = node.toLowerCase();
-        return colorMap[lower] ? colorMap[lower] : node;
-    } else {
-        return node;
-    }
-}
-
-/**
- * A minimal utility wrapper to read a file asynchronously.
- *
- * @param filePath - The file path to read from.
- * @param encoding - The file encoding (default 'utf8').
- * @returns A Promise resolving to the file contents as a string.
- */
-async function readFile(filePath: string, encoding: BufferEncoding = 'utf8'): Promise<string> {
-    return new Promise((resolve, reject) => {
-        const fs = require('fs');
-        fs.readFile(filePath, encoding, (err: Error, data: string) => {
-            if (err) {
-                reject(err);
-            } else {
-                resolve(data);
+            for (const [key, val] of Object.entries(node)) {
+                result[key] = replaceColorsInTheme(val, colorMap);
             }
+            return result;
+        } else if (typeof node === 'string') {
+            const lower = node.toLowerCase();
+            return colorMap[lower] ? colorMap[lower] : node;
+        } else {
+            return node;
+        }
+    }
+
+    /**
+     * A minimal utility wrapper to read a file asynchronously.
+     *
+     * @param filePath - The file path to read from.
+     * @param encoding - The file encoding (default 'utf8').
+     * @returns A Promise resolving to the file contents as a string.
+     */
+    async function readFile(filePath: string, encoding: BufferEncoding = 'utf8'): Promise<string> {
+        return new Promise((resolve, reject) => {
+            const fs = require('fs');
+            fs.readFile(filePath, encoding, (err: Error, data: string) => {
+                if (err) {
+                    reject(err);
+                } else {
+                    resolve(data);
+                }
+            });
         });
-    });
-}
-
-/**
- * Main function that:
- *   1. Checks for --help or missing arguments.
- *   2. Reads and parses the theme, original palette, and new palette.
- *   3. Builds the color map and applies color replacements.
- *   4. Writes the result as JSON to a new file.
- *
- *   @example
- *   ```bash
- *   ts-node updateColors.ts theme.json original_palette.json new_palette.json output.json
- *   ```
- */
-async function main(): Promise<void> {
-    const [, , ...args] = process.argv;
-
-    if (args.length === 0) {
-        printUsage();
-        process.exit(0);
     }
 
-    if (args.length < 4) {
-        console.error('Error: Not enough arguments provided.\n');
-        printUsage();
-        process.exit(1);
-    } else if (args.length > 4) {
-        console.error('Error: Too many arguments provided.\n');
-        printUsage();
-        process.exit(1);
+    /**
+     * Main function that:
+     *   1. Checks for --help or missing arguments.
+     *   2. Reads and parses the theme, original palette, and new palette.
+     *   3. Builds the color map and applies color replacements.
+     *   4. Writes the result as JSON to a new file.
+     *
+     *   @example
+     *   ```bash
+     *   ts-node updateColors.ts theme.json original_palette.json new_palette.json output.json
+     *   ```
+     */
+    async function main(): Promise<void> {
+        const [, , ...args] = process.argv;
+
+        if (args.length === 0) {
+            printUsage();
+            process.exit(0);
+        }
+
+        if (args.length < 4) {
+            console.error('Error: Not enough arguments provided.\n');
+            printUsage();
+            process.exit(1);
+        } else if (args.length > 4) {
+            console.error('Error: Too many arguments provided.\n');
+            printUsage();
+            process.exit(1);
+        }
+
+        const [themePath, originalPath, newPath, outputPath] = args;
+
+        try {
+            const themeData = JSON.parse(await readFile(themePath, 'utf8'));
+            const originalPalette: Palette = JSON.parse(await readFile(originalPath, 'utf8'));
+            const newPalette: Palette = JSON.parse(await readFile(newPath, 'utf8'));
+            const fs = require('fs');
+
+            const colorMap = buildColorMap(originalPalette, newPalette);
+            const updatedTheme = replaceColorsInTheme(themeData, colorMap);
+
+            fs.writeFileSync(outputPath, JSON.stringify(updatedTheme, null, 2), 'utf8');
+
+            console.log(`Successfully wrote updated theme to: ${outputPath}`);
+        } catch (err) {
+            console.error('Error:', err);
+            process.exit(1);
+        }
     }
 
-    const [themePath, originalPath, newPath, outputPath] = args;
-
-    try {
-        const themeData = JSON.parse(await readFile(themePath, 'utf8'));
-        const originalPalette: Palette = JSON.parse(await readFile(originalPath, 'utf8'));
-        const newPalette: Palette = JSON.parse(await readFile(newPath, 'utf8'));
-        const fs = require('fs');
-
-        const colorMap = buildColorMap(originalPalette, newPalette);
-        const updatedTheme = replaceColorsInTheme(themeData, colorMap);
-
-        fs.writeFileSync(outputPath, JSON.stringify(updatedTheme, null, 2), 'utf8');
-
-        console.log(`Successfully wrote updated theme to: ${outputPath}`);
-    } catch (err) {
-        console.error('Error:', err);
-        process.exit(1);
+    if (require.main === module) {
+        main().catch((err) => {
+            console.error(err);
+            process.exit(1);
+        });
     }
-}
-
-if (require.main === module) {
-    main().catch((err) => {
-        console.error(err);
-        process.exit(1);
-    });
-}
-
-type Palette = Record<string, string | Record<string, string>>;
-
-type ColorMap = Record<string, string>;
+})();
diff --git a/src/cli/commander/Parser.ts b/src/cli/commander/Parser.ts
index 78be34b..3e16592 100644
--- a/src/cli/commander/Parser.ts
+++ b/src/cli/commander/Parser.ts
@@ -14,7 +14,7 @@ import { Command, ParsedCommand } from './types';
  * 5. Validates required arguments.
  */
 export class CommandParser {
-    private registry: CommandRegistry;
+    private _registry: CommandRegistry;
 
     /**
      * Constructs a CommandParser with the provided command registry.
@@ -22,7 +22,7 @@ export class CommandParser {
      * @param registry - The command registry containing available commands.
      */
     constructor(registry: CommandRegistry) {
-        this.registry = registry;
+        this._registry = registry;
     }
 
     /**
@@ -33,20 +33,22 @@ export class CommandParser {
      * @throws If no command token is found.
      * @throws If the command token is not registered.
      */
-    parse(input: string): ParsedCommand {
-        const tokens = this.tokenize(input);
+    public parse(input: string): ParsedCommand {
+        const tokens = this._tokenize(input);
 
         if (tokens.length === 0) {
             throw new Error('No command provided.');
         }
 
-        const commandName = tokens.shift()!;
-        const command = this.registry.get(commandName);
+        const commandName = tokens.shift() ?? 'non-existent-command';
+        const command = this._registry.get(commandName);
         if (!command) {
-            throw new Error(`Unknown command: "${commandName}". Use "hyprpanel explain" for available commands.`);
+            throw new Error(
+                `Unknown command: "${commandName}". Use "hyprpanel explain" for available commands.`,
+            );
         }
 
-        const args = this.parseArgs(command, tokens);
+        const args = this._parseArgs(command, tokens);
         return { command, args };
     }
 
@@ -56,10 +58,10 @@ export class CommandParser {
      * @param input - The raw input string to break into tokens.
      * @returns An array of tokens.
      */
-    private tokenize(input: string): string[] {
+    private _tokenize(input: string): string[] {
         const regex = /(?:[^\s"']+|"[^"]*"|'[^']*')+/g;
         const matches = input.match(regex);
-        return matches ? matches.map((token) => this.stripQuotes(token)) : [];
+        return matches ? matches.map((token) => this._stripQuotes(token)) : [];
     }
 
     /**
@@ -68,7 +70,7 @@ export class CommandParser {
      * @param str - The token from which to strip leading or trailing quotes.
      * @returns The token without its outer quotes.
      */
-    private stripQuotes(str: string): string {
+    private _stripQuotes(str: string): string {
         return str.replace(/^["'](.+(?=["']$))["']$/, '$1');
     }
 
@@ -81,13 +83,13 @@ export class CommandParser {
      * @throws If required arguments are missing.
      * @throws If there are too many tokens for the command definition.
      */
-    private parseArgs(command: Command, tokens: string[]): Record<string, unknown> {
+    private _parseArgs(command: Command, tokens: string[]): Record<string, unknown> {
         const args: Record<string, unknown> = {};
         let currentIndex = 0;
 
         for (const argDef of command.args) {
             if (currentIndex >= tokens.length) {
-                if (argDef.required) {
+                if (argDef.required === true) {
                     throw new Error(`Missing required argument: "${argDef.name}".`);
                 }
                 if (argDef.default !== undefined) {
@@ -97,13 +99,13 @@ export class CommandParser {
             }
 
             if (argDef.type === 'object') {
-                const { objectValue, nextIndex } = this.parseObjectTokens(tokens, currentIndex);
+                const { objectValue, nextIndex } = this._parseObjectTokens(tokens, currentIndex);
                 args[argDef.name] = objectValue;
                 currentIndex = nextIndex;
             } else {
                 const value = tokens[currentIndex];
                 currentIndex++;
-                args[argDef.name] = this.convertType(value, argDef.type);
+                args[argDef.name] = this._convertType(value, argDef.type);
             }
         }
 
@@ -125,7 +127,10 @@ export class CommandParser {
      * @returns An object containing the parsed JSON object and the next token index.
      * @throws If the reconstructed JSON is invalid.
      */
-    private parseObjectTokens(tokens: string[], startIndex: number): { objectValue: unknown; nextIndex: number } {
+    private _parseObjectTokens(
+        tokens: string[],
+        startIndex: number,
+    ): { objectValue: unknown; nextIndex: number } {
         let braceCount = 0;
         let started = false;
         const objectTokens: string[] = [];
@@ -142,7 +147,6 @@ export class CommandParser {
 
             objectTokens.push(token);
 
-            // Once we've started and braceCount returns to 0, we assume the object is complete
             if (started && braceCount === 0) break;
             if (token.includes('{')) started = true;
         }
@@ -166,7 +170,7 @@ export class CommandParser {
      * @returns The converted value.
      * @throws If the token cannot be converted to the expected type.
      */
-    private convertType(value: string, type: 'string' | 'number' | 'boolean' | 'object'): unknown {
+    private _convertType(value: string, type: 'string' | 'number' | 'boolean' | 'object'): unknown {
         switch (type) {
             case 'number': {
                 const num = Number(value);
diff --git a/src/cli/commander/Registry.ts b/src/cli/commander/Registry.ts
index be872b1..9b0fa03 100644
--- a/src/cli/commander/Registry.ts
+++ b/src/cli/commander/Registry.ts
@@ -6,7 +6,7 @@ import { Command } from './types';
  * and retrieval of all commands for listing and help functionalities.
  */
 export class CommandRegistry {
-    private commands: Map<string, Command> = new Map();
+    private _commands: Map<string, Command> = new Map();
 
     /**
      * Registers a command. If a command with the same name or alias already exists,
@@ -15,18 +15,18 @@ export class CommandRegistry {
      * @param command - The command to register.
      * @throws If a command with the same name or alias already exists.
      */
-    register(command: Command): void {
-        if (this.commands.has(command.name)) {
+    public register(command: Command): void {
+        if (this._commands.has(command.name)) {
             throw new Error(`Command "${command.name}" is already registered.`);
         }
-        this.commands.set(command.name, command);
+        this._commands.set(command.name, command);
 
         if (command.aliases) {
             for (const alias of command.aliases) {
-                if (this.commands.has(alias)) {
+                if (this._commands.has(alias)) {
                     throw new Error(`Alias "${alias}" is already in use.`);
                 }
-                this.commands.set(alias, command);
+                this._commands.set(alias, command);
             }
         }
     }
@@ -37,8 +37,8 @@ export class CommandRegistry {
      * @param commandName - The name or alias of the command to retrieve.
      * @returns The command if found, otherwise undefined.
      */
-    get(commandName: string): Command | undefined {
-        return this.commands.get(commandName);
+    public get(commandName: string): Command | undefined {
+        return this._commands.get(commandName);
     }
 
     /**
@@ -46,8 +46,8 @@ export class CommandRegistry {
      *
      * @returns An array of all registered commands.
      */
-    getAll(): Command[] {
-        const unique = new Set<Command>(this.commands.values());
+    public getAll(): Command[] {
+        const unique = new Set<Command>(this._commands.values());
         return Array.from(unique);
     }
 }
diff --git a/src/cli/commander/RequestHandler.ts b/src/cli/commander/RequestHandler.ts
index ea0cad3..65c07a8 100644
--- a/src/cli/commander/RequestHandler.ts
+++ b/src/cli/commander/RequestHandler.ts
@@ -8,7 +8,7 @@ import { ResponseCallback } from './types';
  * 3. Handles any errors and passes the result back via the response callback.
  */
 export class RequestHandler {
-    private parser: CommandParser;
+    private _parser: CommandParser;
 
     /**
      * Creates an instance of RequestHandler.
@@ -16,7 +16,7 @@ export class RequestHandler {
      * @param parser - The CommandParser instance to use.
      */
     constructor(parser: CommandParser) {
-        this.parser = parser;
+        this._parser = parser;
     }
 
     /**
@@ -26,20 +26,20 @@ export class RequestHandler {
      * @param response - The callback to handle the response.
      * @returns A promise that resolves when the request is handled.
      */
-    async initializeRequestHandler(input: string, response: ResponseCallback): Promise<void> {
+    public async initializeRequestHandler(input: string, response: ResponseCallback): Promise<void> {
         try {
-            const parsed = this.parser.parse(input);
+            const parsed = this._parser.parse(input);
             const { command, args } = parsed;
 
             const result = command.handler(args);
             if (result instanceof Promise) {
                 const resolved = await result;
-                response(this.formatOutput(resolved));
+                response(this._formatOutput(resolved));
             } else {
-                response(this.formatOutput(result));
+                response(this._formatOutput(result));
             }
         } catch (error) {
-            response(this.formatError(error));
+            response(this._formatError(error));
         }
     }
 
@@ -49,7 +49,7 @@ export class RequestHandler {
      * @param output - The output to format.
      * @returns A string representation of the output.
      */
-    private formatOutput(output: unknown): string {
+    private _formatOutput(output: unknown): string {
         if (typeof output === 'string') {
             return output;
         } else if (typeof output === 'number' || typeof output === 'boolean') {
@@ -71,7 +71,7 @@ export class RequestHandler {
      * @param error - The error to format.
      * @returns A string representation of the error.
      */
-    private formatError(error: unknown): string {
+    private _formatError(error: unknown): string {
         if (error instanceof Error) {
             return `Error: ${error.message}`;
         } else if (typeof error === 'string') {
diff --git a/src/cli/commander/commands/appearance/index.ts b/src/cli/commander/commands/appearance/index.ts
index d33ffff..bb36549 100644
--- a/src/cli/commander/commands/appearance/index.ts
+++ b/src/cli/commander/commands/appearance/index.ts
@@ -1,6 +1,9 @@
 import { errorHandler } from 'src/lib/utils';
-import { BarLayouts } from 'src/lib/types/options';
 import { Command } from '../../types';
+import { setWallpaper } from 'src/shared/wallpaper';
+import { useTheme } from 'src/shared/useTheme';
+import { setLayout } from 'src/shared/utilities';
+import { BarLayouts } from 'src/lib/options/options.types';
 
 export const appearanceCommands: Command[] = [
     {
@@ -58,7 +61,8 @@ export const appearanceCommands: Command[] = [
         args: [
             {
                 name: 'layout',
-                description: 'Bar layout to apply. Wiki: https://hyprpanel.com/configuration/panel.html#layouts',
+                description:
+                    'Bar layout to apply. Wiki: https://hyprpanel.com/configuration/panel.html#layouts',
                 type: 'object',
                 required: true,
             },
diff --git a/src/cli/commander/commands/utility/checkDependencies.ts b/src/cli/commander/commands/utility/checkDependencies.ts
index 62fce76..1405c8b 100644
--- a/src/cli/commander/commands/utility/checkDependencies.ts
+++ b/src/cli/commander/commands/utility/checkDependencies.ts
@@ -110,9 +110,9 @@ function checkServiceStatus(services: string[]): ServiceStatus {
             const enabledResult = runCommand(`systemctl is-enabled ${svc}`);
             const enabledStatus = enabledResult.stdout;
 
-            if (enabledResult && (enabledStatus === 'enabled' || enabledStatus === 'static')) {
+            if (enabledResult !== undefined && (enabledStatus === 'enabled' || enabledStatus === 'static')) {
                 return 'INSTALLED';
-            } else if (enabledResult && enabledStatus === 'disabled') {
+            } else if (enabledResult !== undefined && enabledStatus === 'disabled') {
                 return 'DISABLED';
             } else {
                 return 'MISSING';
@@ -174,7 +174,7 @@ function getDependencyStatus(dep: Dependency): string {
             break;
     }
 
-    if (!dep.description) {
+    if (dep.description === undefined) {
         return `  ${colorText(textStatus, color)} ${dep.package}`;
     }
 
diff --git a/src/cli/commander/commands/utility/index.ts b/src/cli/commander/commands/utility/index.ts
index 66e677a..29184d8 100644
--- a/src/cli/commander/commands/utility/index.ts
+++ b/src/cli/commander/commands/utility/index.ts
@@ -3,6 +3,10 @@ import { errorHandler } from 'src/lib/utils';
 import { Command } from '../../types';
 import { execAsync, Gio, GLib } from 'astal';
 import { checkDependencies } from './checkDependencies';
+import options from 'src/options';
+import { clearAllNotifications } from 'src/shared/notification';
+import { getSystrayItems } from 'src/shared/systray';
+import { idleInhibit } from 'src/shared/utilities';
 
 const audio = AstalWp.get_default();
 
@@ -15,7 +19,7 @@ export const utilityCommands: Command[] = [
         args: [],
         handler: (): string => {
             try {
-                return getSystrayItems();
+                return getSystrayItems() ?? 'No items found!';
             } catch (error) {
                 errorHandler(error);
             }
@@ -88,7 +92,8 @@ export const utilityCommands: Command[] = [
     {
         name: 'idleInhibit',
         aliases: ['idi'],
-        description: 'Enables/Disables the Idle Inhibitor. Toggles the Inhibitor if no parameter is provided.',
+        description:
+            'Enables/Disables the Idle Inhibitor. Toggles the Inhibitor if no parameter is provided.',
         category: 'Utility',
         args: [
             {
@@ -100,7 +105,7 @@ export const utilityCommands: Command[] = [
         ],
         handler: (args: Record<string, unknown>): boolean => {
             try {
-                const shouldInhibit = args['shouldInhibit'] ?? !idleInhibit.get();
+                const shouldInhibit = args['shouldInhibit'] ?? idleInhibit.get() === false;
                 idleInhibit.set(Boolean(shouldInhibit));
 
                 return idleInhibit.get();
diff --git a/src/cli/commander/commands/windowManagement/index.ts b/src/cli/commander/commands/windowManagement/index.ts
index 994ba9d..c3783ee 100644
--- a/src/cli/commander/commands/windowManagement/index.ts
+++ b/src/cli/commander/commands/windowManagement/index.ts
@@ -2,6 +2,7 @@ import { errorHandler } from 'src/lib/utils';
 import { Command } from '../../types';
 import { App } from 'astal/gtk3';
 import { BarVisibility } from 'src/cli/utils/BarVisibility';
+import { isWindowVisible } from 'src/shared/utilities';
 
 export const windowManagementCommands: Command[] = [
     {
diff --git a/src/cli/commander/helpers/index.ts b/src/cli/commander/helpers/index.ts
index 6d6a141..fd499a3 100644
--- a/src/cli/commander/helpers/index.ts
+++ b/src/cli/commander/helpers/index.ts
@@ -58,7 +58,7 @@ export function createExplainCommand(registry: CommandRegistry): Command {
         handler: (args: Record<string, unknown>): string => {
             const commandName = args['commandName'] as string | undefined;
 
-            if (commandName) {
+            if (commandName !== undefined) {
                 return formatCommandExplain(registry, commandName);
             }
 
@@ -134,7 +134,7 @@ function organizeCommandsByCategory(commands: Command[]): CategoryMap {
     const categoryMap: CategoryMap = {};
 
     commands.forEach((cmd) => {
-        if (!categoryMap[cmd.category]) {
+        if (categoryMap[cmd.category] === undefined) {
             categoryMap[cmd.category] = [];
         }
         categoryMap[cmd.category].push(cmd);
@@ -183,7 +183,8 @@ function formatArguments(args: PositionalArg[]): string {
     return (
         args
             .map((arg) => {
-                const requirement = arg.required ? `${ANSI_FG_RED}(required)` : `${ANSI_FG_CYAN}(optional)`;
+                const requirement =
+                    arg.required === true ? `${ANSI_FG_RED}(required)` : `${ANSI_FG_CYAN}(optional)`;
                 const defaultValue =
                     arg.default !== undefined
                         ? ` ${ANSI_FG_MAGENTA}[default: ${JSON.stringify(arg.default)}]${ANSI_RESET}`
diff --git a/src/cli/utils/BarVisibility.ts b/src/cli/utils/BarVisibility.ts
index 0ad871d..1b8ff12 100644
--- a/src/cli/utils/BarVisibility.ts
+++ b/src/cli/utils/BarVisibility.ts
@@ -1,4 +1,4 @@
-import { BarToggleStates } from 'src/lib/types/cli';
+import { BarToggleStates } from 'src/lib/types/cli.types';
 
 export class BarVisibility {
     private static _toggleStates: BarToggleStates = {};
diff --git a/src/components/bar/custom_modules/CustomModules.ts b/src/components/bar/custom_modules/CustomModules.ts
index ef79de8..4297c1e 100644
--- a/src/components/bar/custom_modules/CustomModules.ts
+++ b/src/components/bar/custom_modules/CustomModules.ts
@@ -23,7 +23,7 @@ export class CustomModules {
 
             return customModuleComponents;
         } catch (error) {
-            console.log(`Failed to build custom modules in ${CONFIG_DIR}: ${error}`);
+            console.error(`Failed to build custom modules in ${CONFIG_DIR}: ${error}`);
             throw new Error(`Failed to build custom modules in ${CONFIG_DIR}: ${error}`);
         }
     }
diff --git a/src/components/bar/custom_modules/module_container/helpers/icon.ts b/src/components/bar/custom_modules/module_container/helpers/icon.ts
index 1c664e6..72680f8 100644
--- a/src/components/bar/custom_modules/module_container/helpers/icon.ts
+++ b/src/components/bar/custom_modules/module_container/helpers/icon.ts
@@ -48,7 +48,11 @@ export function getIcon(moduleName: string, commandOutput: string, moduleIcon: C
  * - No matching icon is found for the alt text
  * - Corresponding icon value is not a string
  */
-function getIconFromObject(moduleName: string, commandOutput: string, iconObject: Record<string, unknown>): string {
+function getIconFromObject(
+    moduleName: string,
+    commandOutput: string,
+    iconObject: Record<string, unknown>,
+): string {
     try {
         const commandResults: CommandResults = parseCommandOutputJson(moduleName, commandOutput);
 
@@ -115,7 +119,7 @@ function getIconFromArray(moduleName: string, commandOutput: string, iconArray:
 
         const iconForStep = iconArray.find((_, index) => resultsPercentage <= step * (index + 1));
 
-        return iconForStep || ERROR_ICON;
+        return iconForStep ?? ERROR_ICON;
     } catch {
         return ERROR_ICON;
     }
diff --git a/src/components/bar/custom_modules/module_container/helpers/label.ts b/src/components/bar/custom_modules/module_container/helpers/label.ts
index b58f262..3235f53 100644
--- a/src/components/bar/custom_modules/module_container/helpers/label.ts
+++ b/src/components/bar/custom_modules/module_container/helpers/label.ts
@@ -29,7 +29,10 @@ export function getLabel(moduleName: string, commandOutput: string, labelConfig:
  * @param commandOutput - The processed command output (either a string or object)
  * @returns The extracted value as a string, or empty string if not found
  */
-function getValueForTemplateVariable(templatePath: string, commandOutput: string | Record<string, unknown>): string {
+function getValueForTemplateVariable(
+    templatePath: string,
+    commandOutput: string | Record<string, unknown>,
+): string {
     if (typeof commandOutput === 'string') {
         return getTemplateValueForStringOutput(templatePath, commandOutput);
     }
@@ -62,7 +65,10 @@ function getTemplateValueForStringOutput(templatePath: string, commandOutput: st
  * @param commandOutput - The object representing parsed command output
  * @returns The extracted value as a string, or empty string if path is invalid or value is not primitive
  */
-function getTemplateValueForObjectOutput(templatePath: string, commandOutput: Record<string, unknown>): string {
+function getTemplateValueForObjectOutput(
+    templatePath: string,
+    commandOutput: Record<string, unknown>,
+): string {
     const pathParts = templatePath.split('.');
 
     function isRecord(value: unknown): value is Record<string, unknown> {
diff --git a/src/components/bar/custom_modules/module_container/index.tsx b/src/components/bar/custom_modules/module_container/index.tsx
index a8f45f7..c0f3067 100644
--- a/src/components/bar/custom_modules/module_container/index.tsx
+++ b/src/components/bar/custom_modules/module_container/index.tsx
@@ -1,4 +1,3 @@
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { CustomBarModule } from '../types';
 import { Module } from '../../shared/Module';
 import { Astal } from 'astal/gtk3';
@@ -6,6 +5,7 @@ import { bind, Variable } from 'astal';
 import { getIcon } from './helpers/icon';
 import { getLabel } from './helpers/label';
 import { initActionListener, initCommandPoller, setupModuleInteractions } from './setup';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 export const ModuleContainer = (moduleName: string, moduleMetadata: CustomBarModule): BarBoxChild => {
     const {
diff --git a/src/components/bar/index.tsx b/src/components/bar/index.tsx
index f2527e8..6cb4429 100644
--- a/src/components/bar/index.tsx
+++ b/src/components/bar/index.tsx
@@ -37,6 +37,7 @@ import { bind, Variable } from 'astal';
 import { getLayoutForMonitor, isLayoutEmpty } from './utils/monitors';
 import { GdkMonitorMapper } from './utils/GdkMonitorMapper';
 import { CustomModules } from './custom_modules/CustomModules';
+import { idleInhibit } from 'src/shared/utilities';
 
 const { layouts } = options.bar;
 const { location } = options.theme.bar;
@@ -82,7 +83,7 @@ export const Bar = async (monitor: number): Promise<JSX.Element> => {
             ...customWidgets,
         };
     } catch (error) {
-        console.log(error);
+        console.error(error);
     }
     const hyprlandMonitor = gdkMonitorMapper.mapGdkToHyprland(monitor);
 
@@ -93,7 +94,7 @@ export const Bar = async (monitor: number): Promise<JSX.Element> => {
 
     const computeClassName = bind(layouts).as(() => {
         const foundLayout = getLayoutForMonitor(hyprlandMonitor, layouts.get());
-        return !isLayoutEmpty(foundLayout) ? `bar` : '';
+        return !isLayoutEmpty(foundLayout) ? 'bar' : '';
     });
 
     const computeAnchor = bind(location).as((loc) => {
@@ -104,19 +105,22 @@ export const Bar = async (monitor: number): Promise<JSX.Element> => {
         return Astal.WindowAnchor.TOP | Astal.WindowAnchor.LEFT | Astal.WindowAnchor.RIGHT;
     });
 
-    const computeLayer = Variable.derive([bind(options.theme.bar.layer), bind(options.tear)], (barLayer, tear) => {
-        if (tear && barLayer === 'overlay') {
-            return Astal.Layer.TOP;
-        }
-        const layerMap = {
-            overlay: Astal.Layer.OVERLAY,
-            top: Astal.Layer.TOP,
-            bottom: Astal.Layer.BOTTOM,
-            background: Astal.Layer.BACKGROUND,
-        };
+    const computeLayer = Variable.derive(
+        [bind(options.theme.bar.layer), bind(options.tear)],
+        (barLayer, tear) => {
+            if (tear && barLayer === 'overlay') {
+                return Astal.Layer.TOP;
+            }
+            const layerMap = {
+                overlay: Astal.Layer.OVERLAY,
+                top: Astal.Layer.TOP,
+                bottom: Astal.Layer.BOTTOM,
+                background: Astal.Layer.BACKGROUND,
+            };
 
-        return layerMap[barLayer];
-    });
+            return layerMap[barLayer];
+        },
+    );
 
     const computeBorderLocation = bind(borderLocation).as((brdrLcn) =>
         brdrLcn !== 'none' ? 'bar-panel withBorder' : 'bar-panel',
diff --git a/src/components/bar/modules/battery/helpers/index.ts b/src/components/bar/modules/battery/helpers/index.ts
index 1643493..a620cbf 100644
--- a/src/components/bar/modules/battery/helpers/index.ts
+++ b/src/components/bar/modules/battery/helpers/index.ts
@@ -1,4 +1,4 @@
-import { BatteryIconKeys, BatteryIcons } from 'src/lib/types/battery';
+import { BatteryIconKeys, BatteryIcons } from 'src/lib/types/battery.types';
 
 const batteryIcons: BatteryIcons = {
     0: '󰂎',
diff --git a/src/components/bar/modules/battery/index.tsx b/src/components/bar/modules/battery/index.tsx
index a58d724..719d216 100644
--- a/src/components/bar/modules/battery/index.tsx
+++ b/src/components/bar/modules/battery/index.tsx
@@ -2,15 +2,22 @@ import AstalBattery from 'gi://AstalBattery?version=0.1';
 import { Astal } from 'astal/gtk3';
 import { openMenu } from '../../utils/menu';
 import options from 'src/options';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/utils/helpers.js';
 import Variable from 'astal/variable';
 import { bind } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers';
 import { getBatteryIcon } from './helpers';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const batteryService = AstalBattery.get_default();
-const { label: show_label, rightClick, middleClick, scrollUp, scrollDown, hideLabelWhenFull } = options.bar.battery;
+const {
+    label: show_label,
+    rightClick,
+    middleClick,
+    scrollUp,
+    scrollDown,
+    hideLabelWhenFull,
+} = options.bar.battery;
 
 const BatteryLabel = (): BarBoxChild => {
     const batIcon = Variable.derive(
@@ -55,10 +62,18 @@ const BatteryLabel = (): BarBoxChild => {
     );
 
     const componentTooltip = Variable.derive(
-        [bind(batteryService, 'charging'), bind(batteryService, 'timeToFull'), bind(batteryService, 'timeToEmpty')],
+        [
+            bind(batteryService, 'charging'),
+            bind(batteryService, 'timeToFull'),
+            bind(batteryService, 'timeToEmpty'),
+        ],
         (isCharging, timeToFull, timeToEmpty) => {
             const timeRemaining = isCharging ? timeToFull : timeToEmpty;
-            return generateTooltip(timeRemaining, isCharging, Math.floor(batteryService.percentage * 100) === 100);
+            return generateTooltip(
+                timeRemaining,
+                isCharging,
+                Math.floor(batteryService.percentage * 100) === 100,
+            );
         },
     );
 
@@ -68,7 +83,9 @@ const BatteryLabel = (): BarBoxChild => {
             const isCharged = Math.round(percentage) === 100;
 
             const icon = <label className={'bar-button-icon battery txt-icon'} label={batIcon()} />;
-            const label = <label className={'bar-button-label battery'} label={`${Math.floor(percentage * 100)}%`} />;
+            const label = (
+                <label className={'bar-button-label battery'} label={`${Math.floor(percentage * 100)}%`} />
+            );
 
             const children = [icon];
 
@@ -135,7 +152,9 @@ const BatteryLabel = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/bluetooth/index.tsx b/src/components/bar/modules/bluetooth/index.tsx
index 712edb4..7318ac5 100644
--- a/src/components/bar/modules/bluetooth/index.tsx
+++ b/src/components/bar/modules/bluetooth/index.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options.js';
 import { openMenu } from '../../utils/menu.js';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/utils/helpers.js';
 import { Variable, bind } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers.js';
 import AstalBluetooth from 'gi://AstalBluetooth?version=0.1';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types.js';
 
 const bluetoothService = AstalBluetooth.get_default();
 
@@ -20,7 +20,11 @@ const Bluetooth = (): BarBoxChild => {
         const connectDevices = devices.filter((device) => device.connected);
 
         const label =
-            isPowered && connectDevices.length ? ` Connected (${connectDevices.length})` : isPowered ? 'On' : 'Off';
+            isPowered && connectDevices.length
+                ? ` Connected (${connectDevices.length})`
+                : isPowered
+                  ? 'On'
+                  : 'Off';
 
         return <label label={label} className={'bar-button-label bluetooth'} />;
     };
@@ -102,7 +106,9 @@ const Bluetooth = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/cava/index.tsx b/src/components/bar/modules/cava/index.tsx
index 3b1bd62..9ef0142 100644
--- a/src/components/bar/modules/cava/index.tsx
+++ b/src/components/bar/modules/cava/index.tsx
@@ -1,11 +1,11 @@
 import { Variable, bind } from 'astal';
 import { Astal } from 'astal/gtk3';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { Module } from '../../shared/Module';
 import { inputHandler } from '../../utils/helpers';
 import options from 'src/options';
 import { initSettingsTracker, initVisibilityTracker } from './helpers';
 import AstalCava from 'gi://AstalCava?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const {
     icon,
@@ -46,7 +46,7 @@ export const Cava = (): BarBoxChild => {
     }
 
     return Module({
-        isVis,
+        isVis: bind(isVis),
         label: labelBinding(),
         showIconBinding: bind(label),
         textIcon: bind(icon),
diff --git a/src/components/bar/modules/clock/index.tsx b/src/components/bar/modules/clock/index.tsx
index 11bd6a0..1b985a0 100644
--- a/src/components/bar/modules/clock/index.tsx
+++ b/src/components/bar/modules/clock/index.tsx
@@ -1,20 +1,24 @@
 import { openMenu } from '../../utils/menu';
 import options from 'src/options';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/utils/helpers.js';
 import { bind, Variable } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers';
 import { Astal } from 'astal/gtk3';
-import { systemTime } from 'src/globals/time';
+import { systemTime } from 'src/shared/time';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const { format, icon, showIcon, showTime, rightClick, middleClick, scrollUp, scrollDown } = options.bar.clock;
 const { style } = options.theme.bar.buttons;
 
-const time = Variable.derive([systemTime, format], (c, f) => c.format(f) || '');
+const time = Variable.derive([systemTime, format], (c, f) => c.format(f) ?? '');
 
 const Clock = (): BarBoxChild => {
-    const ClockTime = (): JSX.Element => <label className={'bar-button-label clock bar'} label={bind(time)} />;
-    const ClockIcon = (): JSX.Element => <label className={'bar-button-icon clock txt-icon bar'} label={bind(icon)} />;
+    const ClockTime = (): JSX.Element => (
+        <label className={'bar-button-label clock bar'} label={bind(time)} />
+    );
+    const ClockIcon = (): JSX.Element => (
+        <label className={'bar-button-icon clock txt-icon bar'} label={bind(icon)} />
+    );
 
     const componentClassName = Variable.derive(
         [bind(style), bind(showIcon), bind(showTime)],
@@ -95,7 +99,9 @@ const Clock = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/cpu/helpers/index.ts b/src/components/bar/modules/cpu/helpers/index.ts
index 264792c..6fbf669 100644
--- a/src/components/bar/modules/cpu/helpers/index.ts
+++ b/src/components/bar/modules/cpu/helpers/index.ts
@@ -15,7 +15,6 @@ export const computeCPU = (): number => {
     const currentCpuData = new GTop.glibtop_cpu();
     GTop.glibtop_get_cpu(currentCpuData);
 
-    // Calculate the differences from the previous to current data
     const totalDiff = currentCpuData.total - previousCpuData.total;
     const idleDiff = currentCpuData.idle - previousCpuData.idle;
 
diff --git a/src/components/bar/modules/cpu/index.tsx b/src/components/bar/modules/cpu/index.tsx
index f581bd9..e87a035 100644
--- a/src/components/bar/modules/cpu/index.tsx
+++ b/src/components/bar/modules/cpu/index.tsx
@@ -2,10 +2,10 @@ import { Module } from '../../shared/Module';
 import options from 'src/options';
 import { inputHandler } from 'src/components/bar/utils/helpers';
 import { computeCPU } from './helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const { label, round, leftClick, rightClick, middleClick, scrollUp, scrollDown, pollingInterval, icon } =
     options.bar.customModules.cpu;
diff --git a/src/components/bar/modules/cputemp/helpers/index.ts b/src/components/bar/modules/cputemp/helpers/index.ts
index dcfb240..2f493b1 100644
--- a/src/components/bar/modules/cputemp/helpers/index.ts
+++ b/src/components/bar/modules/cputemp/helpers/index.ts
@@ -1,8 +1,8 @@
 import { Variable } from 'astal';
 import GLib from 'gi://GLib?version=2.0';
-import { convertCelsiusToFahrenheit } from 'src/globals/weather';
-import { UnitType } from 'src/lib/types/weather';
+import { convertCelsiusToFahrenheit } from 'src/shared/weather';
 import options from 'src/options';
+import { UnitType } from 'src/lib/types/weather.types';
 const { sensor } = options.bar.customModules.cpuTemp;
 
 /**
@@ -25,7 +25,7 @@ export const getCPUTemperature = (round: Variable<boolean>, unit: Variable<UnitT
         const [success, tempInfoBytes] = GLib.file_get_contents(sensor.get());
         const tempInfo = new TextDecoder('utf-8').decode(tempInfoBytes);
 
-        if (!success || !tempInfoBytes) {
+        if (!success || tempInfoBytes === null) {
             console.error(`Failed to read ${sensor.get()} or file content is null.`);
             return 0;
         }
diff --git a/src/components/bar/modules/cputemp/index.tsx b/src/components/bar/modules/cputemp/index.tsx
index 04f34f1..d21eca6 100644
--- a/src/components/bar/modules/cputemp/index.tsx
+++ b/src/components/bar/modules/cputemp/index.tsx
@@ -2,11 +2,11 @@ import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
 import { getCPUTemperature } from './helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
-import { UnitType } from 'src/lib/types/weather';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { UnitType } from 'src/lib/types/weather.types';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const {
     label,
diff --git a/src/components/bar/modules/hypridle/index.tsx b/src/components/bar/modules/hypridle/index.tsx
index 2d275f2..c226c1d 100644
--- a/src/components/bar/modules/hypridle/index.tsx
+++ b/src/components/bar/modules/hypridle/index.tsx
@@ -3,31 +3,37 @@ import { Module } from '../../shared/Module';
 import { inputHandler } from '../../utils/helpers';
 import Variable from 'astal/variable';
 import { bind } from 'astal';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { Astal } from 'astal/gtk3';
+import { idleInhibit } from 'src/shared/utilities';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const { label, onIcon, offIcon, onLabel, offLabel, rightClick, middleClick, scrollUp, scrollDown } =
     options.bar.customModules.hypridle;
 
 function toggleInhibit(): void {
-    idleInhibit.set(!idleInhibit.get());
+    idleInhibit.set(idleInhibit.get() === false);
 }
 
 export const Hypridle = (): BarBoxChild => {
-    const iconBinding = Variable.derive([bind(idleInhibit), bind(onIcon), bind(offIcon)], (active, onIcn, offIcn) => {
-        return active ? onIcn : offIcn;
-    });
+    const iconBinding = Variable.derive(
+        [bind(idleInhibit), bind(onIcon), bind(offIcon)],
+        (active, onIcn, offIcn) => {
+            return active === true ? onIcn : offIcn;
+        },
+    );
 
     const labelBinding = Variable.derive(
         [bind(idleInhibit), bind(onLabel), bind(offLabel)],
         (active, onLbl, offLbl) => {
-            return active ? onLbl : offLbl;
+            return active === true ? onLbl : offLbl;
         },
     );
 
     const hypridleModule = Module({
         textIcon: iconBinding(),
-        tooltipText: bind(idleInhibit).as((active) => `Idle Inhibitor: ${active ? 'Enabled' : 'Disabled'}`),
+        tooltipText: bind(idleInhibit).as(
+            (active) => `Idle Inhibitor: ${active === true ? 'Enabled' : 'Disabled'}`,
+        ),
         boxClass: 'hypridle',
         label: labelBinding(),
         showLabelBinding: bind(label),
diff --git a/src/components/bar/modules/hyprsunset/helpers/index.ts b/src/components/bar/modules/hyprsunset/helpers/index.ts
index 8abaca5..11c25da 100644
--- a/src/components/bar/modules/hyprsunset/helpers/index.ts
+++ b/src/components/bar/modules/hyprsunset/helpers/index.ts
@@ -9,7 +9,7 @@ const { temperature } = options.bar.customModules.hyprsunset;
  * This command checks if the hyprsunset process is currently running by using the `pgrep` command.
  * It returns 'yes' if the process is found and 'no' otherwise.
  */
-export const isActiveCommand = `bash -c "pgrep -x 'hyprsunset' > /dev/null && echo 'yes' || echo 'no'"`;
+export const isActiveCommand = "bash -c \"pgrep -x 'hyprsunset' > /dev/null && echo 'yes' || echo 'no'\"";
 
 /**
  * A variable to track the active state of the hyprsunset process.
@@ -33,7 +33,7 @@ export const toggleSunset = (isActive: Variable<boolean>): void => {
                 });
             });
         } else {
-            execAsync(`bash -c "pkill hyprsunset "`).then(() => {
+            execAsync('bash -c "pkill hyprsunset "').then(() => {
                 execAsync(isActiveCommand).then((res) => {
                     isActive.set(res === 'yes');
                 });
diff --git a/src/components/bar/modules/hyprsunset/index.tsx b/src/components/bar/modules/hyprsunset/index.tsx
index f6fbeac..293c51a 100644
--- a/src/components/bar/modules/hyprsunset/index.tsx
+++ b/src/components/bar/modules/hyprsunset/index.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler, throttleInput } from 'src/components/bar/utils/helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { checkSunsetStatus, isActive, toggleSunset } from './helpers';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const {
     label,
@@ -25,24 +25,35 @@ const dummyVar = Variable(undefined);
 
 checkSunsetStatus();
 
-const sunsetPoller = new FunctionPoller<undefined, []>(dummyVar, [], bind(pollingInterval), checkSunsetStatus);
+const sunsetPoller = new FunctionPoller<undefined, []>(
+    dummyVar,
+    [],
+    bind(pollingInterval),
+    checkSunsetStatus,
+);
 
 sunsetPoller.initialize('hyprsunset');
 
 const throttledToggleSunset = throttleInput(() => toggleSunset(isActive), 1000);
 
 export const Hyprsunset = (): BarBoxChild => {
-    const iconBinding = Variable.derive([bind(isActive), bind(onIcon), bind(offIcon)], (active, onIcn, offIcn) => {
-        return active ? onIcn : offIcn;
-    });
+    const iconBinding = Variable.derive(
+        [bind(isActive), bind(onIcon), bind(offIcon)],
+        (active, onIcn, offIcn) => {
+            return active ? onIcn : offIcn;
+        },
+    );
 
     const tooltipBinding = Variable.derive([isActive, temperature], (active, temp) => {
         return `Hyprsunset ${active ? 'enabled' : 'disabled'}\nTemperature: ${temp}`;
     });
 
-    const labelBinding = Variable.derive([bind(isActive), bind(onLabel), bind(offLabel)], (active, onLbl, offLbl) => {
-        return active ? onLbl : offLbl;
-    });
+    const labelBinding = Variable.derive(
+        [bind(isActive), bind(onLabel), bind(offLabel)],
+        (active, onLbl, offLbl) => {
+            return active ? onLbl : offLbl;
+        },
+    );
 
     const hyprsunsetModule = Module({
         textIcon: iconBinding(),
diff --git a/src/components/bar/modules/kblayout/helpers/index.ts b/src/components/bar/modules/kblayout/helpers/index.ts
index c7bc5de..9965dd5 100644
--- a/src/components/bar/modules/kblayout/helpers/index.ts
+++ b/src/components/bar/modules/kblayout/helpers/index.ts
@@ -2,10 +2,8 @@ import {
     HyprctlDeviceLayout,
     HyprctlKeyboard,
     KbLabelType,
-    LayoutKeys,
-    LayoutValues,
-} from 'src/lib/types/customModules/kbLayout';
-import { layoutMap } from './layouts';
+} from 'src/lib/types/customModules/kbLayout.types.js';
+import { LayoutKeys, layoutMap, LayoutValues } from './layouts';
 
 /**
  * Retrieves the keyboard layout from a given JSON string and format.
@@ -32,8 +30,21 @@ export const getKeyboardLayout = (layoutData: string, format: KbLabelType): Layo
         mainKb = keyboards[keyboards.length - 1];
     }
 
-    const layout: LayoutKeys = mainKb['active_keymap'] as LayoutKeys;
+    if (!isValidLayout(mainKb.active_keymap)) {
+        return layoutMap['Unknown Layout'];
+    }
+
+    const layout: LayoutKeys = mainKb.active_keymap;
+
     const foundLayout: LayoutValues = layoutMap[layout];
 
-    return format === 'code' ? foundLayout || layout : layout;
+    return format === 'code' ? (foundLayout ?? layout) : layout;
 };
+
+function isValidLayout(kbLayout: string): kbLayout is LayoutKeys {
+    if (!Object.keys(layoutMap).includes(kbLayout)) {
+        return false;
+    }
+
+    return true;
+}
diff --git a/src/components/bar/modules/kblayout/helpers/layouts.ts b/src/components/bar/modules/kblayout/helpers/layouts.ts
index 299ff08..d280823 100644
--- a/src/components/bar/modules/kblayout/helpers/layouts.ts
+++ b/src/components/bar/modules/kblayout/helpers/layouts.ts
@@ -1,6 +1,5 @@
-import { LayoutKeys, LayoutValues } from 'src/lib/types/customModules/kbLayout';
-
-export const layoutMap: Record<LayoutKeys, LayoutValues> = {
+// Create a const object with all layouts
+const layoutMapObj = {
     'Abkhazian (Russia)': 'RU (Ab)',
     Akan: 'GH (Akan)',
     Albanian: 'AL',
@@ -585,3 +584,8 @@ export const layoutMap: Record<LayoutKeys, LayoutValues> = {
     Yoruba: 'NG (Yoruba)',
     'Unknown Layout': 'Unknown',
 } as const;
+
+export type LayoutKeys = keyof typeof layoutMapObj;
+export type LayoutValues = (typeof layoutMapObj)[LayoutKeys];
+
+export const layoutMap = layoutMapObj;
diff --git a/src/components/bar/modules/kblayout/index.tsx b/src/components/bar/modules/kblayout/index.tsx
index df11a0c..539a31c 100644
--- a/src/components/bar/modules/kblayout/index.tsx
+++ b/src/components/bar/modules/kblayout/index.tsx
@@ -2,11 +2,11 @@ import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
 import { getKeyboardLayout } from './helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { bind } from 'astal';
 import { useHook } from 'src/lib/shared/hookHandler';
 import { Astal } from 'astal/gtk3';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const hyprlandService = AstalHyprland.get_default();
 const { label, labelType, icon, leftClick, rightClick, middleClick, scrollUp, scrollDown } =
diff --git a/src/components/bar/modules/media/helpers/index.ts b/src/components/bar/modules/media/helpers/index.ts
index 3dc4694..4f41165 100644
--- a/src/components/bar/modules/media/helpers/index.ts
+++ b/src/components/bar/modules/media/helpers/index.ts
@@ -1,7 +1,7 @@
-import { MediaTags } from 'src/lib/types/audio.js';
-import { Opt } from 'src/lib/option';
 import AstalMpris from 'gi://AstalMpris?version=0.1';
 import { Variable } from 'astal';
+import { MediaTags } from 'src/lib/types/audio.types';
+import { Opt } from 'src/lib/options';
 
 /**
  * Retrieves the icon for a given media player.
@@ -82,8 +82,8 @@ export const generateMediaLabel = (
     const currentPlayer = activePlayer.get();
 
     if (!currentPlayer || !show_label.get()) {
-        songIcon.set(getIconForPlayer(activePlayer.get()?.identity || ''));
-        return `Media`;
+        songIcon.set(getIconForPlayer(activePlayer.get()?.identity ?? ''));
+        return 'Media';
     }
 
     const { title, identity, artist, album, busName } = currentPlayer;
@@ -107,7 +107,7 @@ export const generateMediaLabel = (
                 return '';
             }
             const value = p1 !== undefined ? mediaTags[p1] : '';
-            const suffix = p2?.length ? p2.slice(1) : '';
+            const suffix = p2 !== undefined && p2.length > 0 ? p2.slice(1) : '';
             return value ? value + suffix : '';
         },
     );
diff --git a/src/components/bar/modules/media/index.tsx b/src/components/bar/modules/media/index.tsx
index c5b999d..042ae51 100644
--- a/src/components/bar/modules/media/index.tsx
+++ b/src/components/bar/modules/media/index.tsx
@@ -4,10 +4,10 @@ import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/util
 import { generateMediaLabel } from './helpers/index.js';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers.js';
 import { bind, Variable } from 'astal';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { Astal } from 'astal/gtk3';
-import { activePlayer, mediaAlbum, mediaArtist, mediaTitle } from 'src/globals/media.js';
+import { activePlayer, mediaAlbum, mediaArtist, mediaTitle } from 'src/shared/media.js';
 import AstalMpris from 'gi://AstalMpris?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types.js';
 
 const mprisService = AstalMpris.get_default();
 const {
@@ -49,15 +49,18 @@ const Media = (): BarBoxChild => {
         },
     );
 
-    const componentClassName = Variable.derive([options.theme.bar.buttons.style, show_label], (style: string) => {
-        const styleMap: Record<string, string> = {
-            default: 'style1',
-            split: 'style2',
-            wave: 'style3',
-            wave2: 'style3',
-        };
-        return `media-container ${styleMap[style]}`;
-    });
+    const componentClassName = Variable.derive(
+        [options.theme.bar.buttons.style, show_label],
+        (style: string) => {
+            const styleMap: Record<string, string> = {
+                default: 'style1',
+                split: 'style2',
+                wave: 'style3',
+                wave2: 'style3',
+            };
+            return `media-container ${styleMap[style]}`;
+        },
+    );
 
     const component = (
         <box
@@ -68,14 +71,17 @@ const Media = (): BarBoxChild => {
                 componentClassName.drop();
             }}
         >
-            <label className={'bar-button-icon media txt-icon bar'} label={bind(songIcon).as((icn) => icn || '󰝚')} />
+            <label
+                className={'bar-button-icon media txt-icon bar'}
+                label={bind(songIcon).as((icn) => icn || '󰝚')}
+            />
             <label className={'bar-button-label media'} label={mediaLabel()} />
         </box>
     );
 
     return {
         component,
-        isVis,
+        isVis: bind(isVis),
         boxClass: 'media',
         props: {
             setup: (self: Astal.Button): void => {
@@ -113,7 +119,9 @@ const Media = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/menu/index.tsx b/src/components/bar/modules/menu/index.tsx
index 5870579..85f7c9c 100644
--- a/src/components/bar/modules/menu/index.tsx
+++ b/src/components/bar/modules/menu/index.tsx
@@ -4,14 +4,15 @@ import { openMenu } from '../../utils/menu.js';
 import { getDistroIcon } from '../../../../lib/utils.js';
 import { Variable, bind } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers.js';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types.js';
 
 const { rightClick, middleClick, scrollUp, scrollDown, autoDetectIcon, icon } = options.bar.launcher;
 
 const Menu = (): BarBoxChild => {
-    const iconBinding = Variable.derive([autoDetectIcon, icon], (autoDetect: boolean, iconValue: string): string =>
-        autoDetect ? getDistroIcon() : iconValue,
+    const iconBinding = Variable.derive(
+        [autoDetectIcon, icon],
+        (autoDetect: boolean, iconValue: string): string => (autoDetect ? getDistroIcon() : iconValue),
     );
 
     const componentClassName = bind(options.theme.bar.buttons.style).as((style: string) => {
@@ -75,7 +76,9 @@ const Menu = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/microphone/index.tsx b/src/components/bar/modules/microphone/index.tsx
index 6a3a8e8..6ac8dd6 100644
--- a/src/components/bar/modules/microphone/index.tsx
+++ b/src/components/bar/modules/microphone/index.tsx
@@ -1,10 +1,10 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { bind, Variable } from 'astal';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { Astal } from 'astal/gtk3';
 import { inputHandler } from '../../utils/helpers';
 import AstalWp from 'gi://AstalWp?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const wireplumber = AstalWp.get_default() as AstalWp.Wp;
 const audioService = wireplumber.audio;
diff --git a/src/components/bar/modules/netstat/helpers/index.ts b/src/components/bar/modules/netstat/helpers/index.ts
index ddc7a9b..1c397bf 100644
--- a/src/components/bar/modules/netstat/helpers/index.ts
+++ b/src/components/bar/modules/netstat/helpers/index.ts
@@ -1,8 +1,8 @@
 import GLib from 'gi://GLib';
 import { Variable } from 'astal';
-import { NetworkResourceData } from 'src/lib/types/customModules/network';
-import { GET_DEFAULT_NETSTAT_DATA } from 'src/lib/types/defaults/netstat';
-import { RateUnit } from 'src/lib/types/bar';
+import { RateUnit } from 'src/lib/types/bar.types';
+import { NetworkResourceData } from 'src/lib/types/customModules/network.types';
+import { getDefaultNetstatData } from 'src/lib/types/defaults/netstat.types';
 
 let previousNetUsage = { rx: 0, tx: 0, time: 0 };
 
@@ -97,16 +97,20 @@ const isValidInterface = (iface: NetworkUsage | null, interfaceName: string): bo
  */
 const getNetworkUsage = (interfaceName: string = ''): NetworkUsage => {
     const [success, data] = GLib.file_get_contents('/proc/net/dev');
+    const defaultStats = { name: '', rx: 0, tx: 0 };
+
     if (!success) {
         console.error('Failed to read /proc/net/dev');
-        return { name: '', rx: 0, tx: 0 };
+        return defaultStats;
     }
 
     const lines = new TextDecoder('utf-8').decode(data).split('\n');
+
     for (const line of lines) {
         const iface = parseInterfaceData(line);
+
         if (isValidInterface(iface, interfaceName)) {
-            return iface!;
+            return iface ?? defaultStats;
         }
     }
 
@@ -131,9 +135,9 @@ export const computeNetwork = (
     dataType: Variable<RateUnit>,
 ): NetworkResourceData => {
     const rateUnit = dataType.get();
-    const interfaceName = interfaceNameVar ? interfaceNameVar.get() : '';
+    const interfaceName = interfaceNameVar.get();
 
-    const DEFAULT_NETSTAT_DATA = GET_DEFAULT_NETSTAT_DATA(rateUnit);
+    const DEFAULT_NETSTAT_DATA = getDefaultNetstatData(rateUnit);
     try {
         const { rx, tx, name } = getNetworkUsage(interfaceName);
         const currentTime = Date.now();
diff --git a/src/components/bar/modules/netstat/index.tsx b/src/components/bar/modules/netstat/index.tsx
index 2aeff8f..fe9f2d4 100644
--- a/src/components/bar/modules/netstat/index.tsx
+++ b/src/components/bar/modules/netstat/index.tsx
@@ -2,14 +2,14 @@ import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
 import { computeNetwork } from './helpers';
-import { BarBoxChild, NetstatLabelType, RateUnit } from 'src/lib/types/bar';
-import { NetworkResourceData } from 'src/lib/types/customModules/network';
-import { NETWORK_LABEL_TYPES } from 'src/lib/types/defaults/bar';
-import { GET_DEFAULT_NETSTAT_DATA } from 'src/lib/types/defaults/netstat';
+import { NETWORK_LABEL_TYPES } from 'src/lib/types/defaults/bar.types';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
 import { bind, Variable } from 'astal';
 import AstalNetwork from 'gi://AstalNetwork?version=0.1';
 import { Astal } from 'astal/gtk3';
+import { RateUnit, BarBoxChild, NetstatLabelType } from 'src/lib/types/bar.types';
+import { NetworkResourceData } from 'src/lib/types/customModules/network.types';
+import { getDefaultNetstatData } from 'src/lib/types/defaults/netstat.types';
 
 const networkService = AstalNetwork.get_default();
 const {
@@ -28,7 +28,7 @@ const {
     pollingInterval,
 } = options.bar.customModules.netstat;
 
-export const networkUsage = Variable<NetworkResourceData>(GET_DEFAULT_NETSTAT_DATA(rateUnit.get()));
+export const networkUsage = Variable<NetworkResourceData>(getDefaultNetstatData(rateUnit.get()));
 
 const netstatPoller = new FunctionPoller<
     NetworkResourceData,
@@ -69,7 +69,8 @@ export const Netstat = (): BarBoxChild => {
 
     const labelBinding = Variable.derive(
         [bind(networkUsage), bind(labelType)],
-        (networkService: NetworkResourceData, lblTyp: NetstatLabelType) => renderNetworkLabel(lblTyp, networkService),
+        (networkService: NetworkResourceData, lblTyp: NetstatLabelType) =>
+            renderNetworkLabel(lblTyp, networkService),
     );
 
     const netstatModule = Module({
@@ -98,7 +99,8 @@ export const Netstat = (): BarBoxChild => {
                         fn: () => {
                             labelType.set(
                                 NETWORK_LABEL_TYPES[
-                                    (NETWORK_LABEL_TYPES.indexOf(labelType.get()) + 1) % NETWORK_LABEL_TYPES.length
+                                    (NETWORK_LABEL_TYPES.indexOf(labelType.get()) + 1) %
+                                        NETWORK_LABEL_TYPES.length
                                 ] as NetstatLabelType,
                             );
                         },
@@ -107,7 +109,9 @@ export const Netstat = (): BarBoxChild => {
                         fn: () => {
                             labelType.set(
                                 NETWORK_LABEL_TYPES[
-                                    (NETWORK_LABEL_TYPES.indexOf(labelType.get()) - 1 + NETWORK_LABEL_TYPES.length) %
+                                    (NETWORK_LABEL_TYPES.indexOf(labelType.get()) -
+                                        1 +
+                                        NETWORK_LABEL_TYPES.length) %
                                         NETWORK_LABEL_TYPES.length
                                 ] as NetstatLabelType,
                             );
diff --git a/src/components/bar/modules/network/helpers.ts b/src/components/bar/modules/network/helpers.ts
index 7b43821..8de5cb6 100644
--- a/src/components/bar/modules/network/helpers.ts
+++ b/src/components/bar/modules/network/helpers.ts
@@ -19,7 +19,7 @@ const handleWiredIcon = (): void => {
     wiredIconBinding?.drop();
     wiredIconBinding = undefined;
 
-    if (!networkService.wired) {
+    if (networkService.wired === null) {
         return;
     }
 
@@ -38,7 +38,7 @@ const handleWirelessIcon = (): void => {
     wirelessIconBinding?.drop();
     wirelessIconBinding = undefined;
 
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return;
     }
 
diff --git a/src/components/bar/modules/network/index.tsx b/src/components/bar/modules/network/index.tsx
index 335bc71..0ebd44d 100644
--- a/src/components/bar/modules/network/index.tsx
+++ b/src/components/bar/modules/network/index.tsx
@@ -5,8 +5,8 @@ import { bind, Variable } from 'astal';
 import { onPrimaryClick, onSecondaryClick, onMiddleClick, onScroll } from 'src/lib/shared/eventHandlers';
 import { Astal, Gtk } from 'astal/gtk3';
 import AstalNetwork from 'gi://AstalNetwork?version=0.1';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { formatWifiInfo, wiredIcon, wirelessIcon } from './helpers';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const networkService = AstalNetwork.get_default();
 const { label, truncation, truncation_size, rightClick, middleClick, scrollDown, scrollUp, showWifiInfo } =
@@ -20,7 +20,9 @@ const Network = (): BarBoxChild => {
         },
     );
 
-    const NetworkIcon = (): JSX.Element => <icon className={'bar-button-icon network-icon'} icon={iconBinding()} />;
+    const NetworkIcon = (): JSX.Element => (
+        <icon className={'bar-button-icon network-icon'} icon={iconBinding()} />
+    );
 
     const networkLabel = Variable.derive(
         [
@@ -32,14 +34,16 @@ const Network = (): BarBoxChild => {
 
             bind(networkService, 'state'),
             bind(networkService, 'connectivity'),
-            ...(networkService.wifi ? [bind(networkService.wifi, 'enabled')] : []),
+            ...(networkService.wifi !== null ? [bind(networkService.wifi, 'enabled')] : []),
         ],
         (primaryNetwork, showLabel, trunc, tSize, showWifiInfo) => {
             if (!showLabel) {
                 return <box />;
             }
             if (primaryNetwork === AstalNetwork.Primary.WIRED) {
-                return <label className={'bar-button-label network-label'} label={'Wired'.substring(0, tSize)} />;
+                return (
+                    <label className={'bar-button-label network-label'} label={'Wired'.substring(0, tSize)} />
+                );
             }
             const networkWifi = networkService.wifi;
             if (networkWifi != null) {
@@ -54,11 +58,15 @@ const Network = (): BarBoxChild => {
                     <label
                         className={'bar-button-label network-label'}
                         label={
-                            networkWifi.active_access_point
+                            networkWifi.active_access_point !== null
                                 ? `${trunc ? networkWifi.ssid.substring(0, tSize) : networkWifi.ssid}`
                                 : '--'
                         }
-                        tooltipText={showWifiInfo && networkWifi.active_access_point ? formatWifiInfo(networkWifi) : ''}
+                        tooltipText={
+                            showWifiInfo && networkWifi.active_access_point !== null
+                                ? formatWifiInfo(networkWifi)
+                                : ''
+                        }
                     />
                 );
             }
@@ -135,7 +143,9 @@ const Network = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/notifications/index.tsx b/src/components/bar/modules/notifications/index.tsx
index 6f06ca8..f928235 100644
--- a/src/components/bar/modules/notifications/index.tsx
+++ b/src/components/bar/modules/notifications/index.tsx
@@ -3,13 +3,14 @@ import { Astal, Gtk } from 'astal/gtk3';
 import { openMenu } from '../../utils/menu';
 import options from 'src/options';
 import { filterNotifications } from 'src/lib/shared/notifications.js';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/utils/helpers.js';
 import { bind, Variable } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const notifdService = AstalNotifd.get_default();
-const { show_total, rightClick, middleClick, scrollUp, scrollDown, hideCountWhenZero } = options.bar.notifications;
+const { show_total, rightClick, middleClick, scrollUp, scrollDown, hideCountWhenZero } =
+    options.bar.notifications;
 const { ignore } = options.notifications;
 
 export const Notifications = (): BarBoxChild => {
@@ -122,7 +123,9 @@ export const Notifications = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/power/index.tsx b/src/components/bar/modules/power/index.tsx
index 9e2078c..ea09ed4 100644
--- a/src/components/bar/modules/power/index.tsx
+++ b/src/components/bar/modules/power/index.tsx
@@ -1,9 +1,9 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const { icon, leftClick, rightClick, middleClick, scrollUp, scrollDown } = options.bar.customModules.power;
 
@@ -11,7 +11,7 @@ export const Power = (): BarBoxChild => {
     const powerModule = Module({
         tooltipText: 'Power Menu',
         textIcon: bind(icon),
-        showLabelBinding: Variable(false),
+        showLabelBinding: bind(Variable(false)),
         boxClass: 'powermodule',
         props: {
             setup: (self: Astal.Button) => {
diff --git a/src/components/bar/modules/ram/helpers/index.ts b/src/components/bar/modules/ram/helpers/index.ts
index fe818eb..e334bce 100644
--- a/src/components/bar/modules/ram/helpers/index.ts
+++ b/src/components/bar/modules/ram/helpers/index.ts
@@ -1,6 +1,6 @@
 import { divide } from 'src/components/bar/utils/helpers';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
 import { GLib, Variable } from 'astal';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 /**
  * Calculates the RAM usage.
@@ -16,7 +16,7 @@ export const calculateRamUsage = (round: Variable<boolean>): GenericResourceData
     try {
         const [success, meminfoBytes] = GLib.file_get_contents('/proc/meminfo');
 
-        if (!success || !meminfoBytes) {
+        if (!success || meminfoBytes === null) {
             throw new Error('Failed to read /proc/meminfo or file content is null.');
         }
 
diff --git a/src/components/bar/modules/ram/index.tsx b/src/components/bar/modules/ram/index.tsx
index 255662a..ba1b03d 100644
--- a/src/components/bar/modules/ram/index.tsx
+++ b/src/components/bar/modules/ram/index.tsx
@@ -2,12 +2,12 @@ import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { calculateRamUsage } from './helpers';
 import { formatTooltip, inputHandler, renderResourceLabel } from 'src/components/bar/utils/helpers';
-import { LABEL_TYPES } from 'src/lib/types/defaults/bar';
+import { LABEL_TYPES } from 'src/lib/types/defaults/bar.types';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
 import { bind, Variable } from 'astal';
-import { BarBoxChild, ResourceLabelType } from 'src/lib/types/bar';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild, ResourceLabelType } from 'src/lib/types/bar.types';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 const { label, labelType, round, leftClick, rightClick, middleClick, pollingInterval, icon } =
     options.bar.customModules.ram;
@@ -68,7 +68,8 @@ export const Ram = (): BarBoxChild => {
                         fn: () => {
                             labelType.set(
                                 LABEL_TYPES[
-                                    (LABEL_TYPES.indexOf(labelType.get()) - 1 + LABEL_TYPES.length) % LABEL_TYPES.length
+                                    (LABEL_TYPES.indexOf(labelType.get()) - 1 + LABEL_TYPES.length) %
+                                        LABEL_TYPES.length
                                 ] as ResourceLabelType,
                             );
                         },
diff --git a/src/components/bar/modules/storage/helpers/index.ts b/src/components/bar/modules/storage/helpers/index.ts
index 2d10b8b..fb40f04 100644
--- a/src/components/bar/modules/storage/helpers/index.ts
+++ b/src/components/bar/modules/storage/helpers/index.ts
@@ -2,7 +2,7 @@ import GTop from 'gi://GTop';
 
 import { divide } from 'src/components/bar/utils/helpers';
 import { Variable } from 'astal';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 /**
  * Computes the storage usage for the root filesystem.
diff --git a/src/components/bar/modules/storage/index.tsx b/src/components/bar/modules/storage/index.tsx
index a50e9f7..adc3fdd 100644
--- a/src/components/bar/modules/storage/index.tsx
+++ b/src/components/bar/modules/storage/index.tsx
@@ -2,12 +2,12 @@ import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { formatTooltip, inputHandler, renderResourceLabel } from 'src/components/bar/utils/helpers';
 import { computeStorage } from './helpers';
-import { BarBoxChild, ResourceLabelType } from 'src/lib/types/bar';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
-import { LABEL_TYPES } from 'src/lib/types/defaults/bar';
+import { LABEL_TYPES } from 'src/lib/types/defaults/bar.types';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild, ResourceLabelType } from 'src/lib/types/bar.types';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 const { label, labelType, icon, round, leftClick, rightClick, middleClick, pollingInterval } =
     options.bar.customModules.storage;
@@ -66,7 +66,8 @@ export const Storage = (): BarBoxChild => {
                         fn: () => {
                             labelType.set(
                                 LABEL_TYPES[
-                                    (LABEL_TYPES.indexOf(labelType.get()) - 1 + LABEL_TYPES.length) % LABEL_TYPES.length
+                                    (LABEL_TYPES.indexOf(labelType.get()) - 1 + LABEL_TYPES.length) %
+                                        LABEL_TYPES.length
                                 ] as ResourceLabelType,
                             );
                         },
diff --git a/src/components/bar/modules/submap/index.tsx b/src/components/bar/modules/submap/index.tsx
index 6c22341..0faff05 100644
--- a/src/components/bar/modules/submap/index.tsx
+++ b/src/components/bar/modules/submap/index.tsx
@@ -1,12 +1,12 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { capitalizeFirstLetter } from 'src/lib/utils';
 import { getInitialSubmap, isSubmapEnabled } from './helpers';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const hyprlandService = AstalHyprland.get_default();
 const {
diff --git a/src/components/bar/modules/systray/index.tsx b/src/components/bar/modules/systray/index.tsx
index f25e141..8154223 100644
--- a/src/components/bar/modules/systray/index.tsx
+++ b/src/components/bar/modules/systray/index.tsx
@@ -2,8 +2,8 @@ import { isMiddleClick, isPrimaryClick, isSecondaryClick, Notify } from '../../.
 import options from '../../../../options';
 import AstalTray from 'gi://AstalTray?version=0.1';
 import { bind, Gio, Variable } from 'astal';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { Gdk, Gtk } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const systemtray = AstalTray.get_default();
 const { ignore, customIcons } = options.bar.systray;
@@ -28,7 +28,13 @@ const MenuCustomIcon = ({ iconLabel, iconColor, item }: MenuCustomIconProps): JS
 };
 
 const MenuDefaultIcon = ({ item }: MenuEntryProps): JSX.Element => {
-    return <icon className={'systray-icon'} gIcon={bind(item, 'gicon')} tooltipMarkup={bind(item, 'tooltipMarkup')} />;
+    return (
+        <icon
+            className={'systray-icon'}
+            gIcon={bind(item, 'gicon')}
+            tooltipMarkup={bind(item, 'tooltipMarkup')}
+        />
+    );
 };
 
 const MenuEntry = ({ item, child }: MenuEntryProps): JSX.Element => {
@@ -37,10 +43,10 @@ const MenuEntry = ({ item, child }: MenuEntryProps): JSX.Element => {
     const entryBinding = Variable.derive(
         [bind(item, 'menuModel'), bind(item, 'actionGroup')],
         (menuModel, actionGroup) => {
-            if (!menuModel) {
+            if (menuModel === null) {
                 return console.error(`Menu Model not found for ${item.id}`);
             }
-            if (!actionGroup) {
+            if (actionGroup === null) {
                 return console.error(`Action Group not found for ${item.id}`);
             }
 
@@ -85,7 +91,9 @@ const SysTray = (): BarBoxChild => {
             isVis.set(filteredTray.length > 0);
 
             return filteredTray.map((item) => {
-                const matchedCustomIcon = Object.keys(custIcons).find((iconRegex) => item.id.match(iconRegex));
+                const matchedCustomIcon = Object.keys(custIcons).find((iconRegex) =>
+                    item.id.match(iconRegex),
+                );
 
                 if (matchedCustomIcon !== undefined) {
                     const iconLabel = custIcons[matchedCustomIcon].icon || '󰠫';
@@ -122,7 +130,7 @@ const SysTray = (): BarBoxChild => {
         component,
         isVisible: true,
         boxClass: 'systray',
-        isVis,
+        isVis: bind(isVis),
         isBox: true,
         props: {},
     };
diff --git a/src/components/bar/modules/updates/index.tsx b/src/components/bar/modules/updates/index.tsx
index cb0cb0f..5b29d5a 100644
--- a/src/components/bar/modules/updates/index.tsx
+++ b/src/components/bar/modules/updates/index.tsx
@@ -1,10 +1,10 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { BashPoller } from 'src/lib/poller/BashPoller';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const {
     updateCommand,
@@ -75,7 +75,7 @@ export const Updates = (): BarBoxChild => {
         textIcon: updatesIcon(),
         tooltipText: bind(pendingUpdatesTooltip),
         boxClass: 'updates',
-        isVis: isVis,
+        isVis: bind(isVis),
         label: bind(pendingUpdates),
         showLabelBinding: bind(label),
         props: {
diff --git a/src/components/bar/modules/volume/helpers/index.ts b/src/components/bar/modules/volume/helpers/index.ts
index 2ecee13..de15c2f 100644
--- a/src/components/bar/modules/volume/helpers/index.ts
+++ b/src/components/bar/modules/volume/helpers/index.ts
@@ -1,6 +1,4 @@
-import { VolumeIcons } from 'src/lib/types/volume';
-
-const icons: VolumeIcons = {
+const icons: Record<number, string> = {
     101: '󰕾',
     66: '󰕾',
     34: '󰖀',
diff --git a/src/components/bar/modules/volume/index.tsx b/src/components/bar/modules/volume/index.tsx
index 11789f7..7b0e3f8 100644
--- a/src/components/bar/modules/volume/index.tsx
+++ b/src/components/bar/modules/volume/index.tsx
@@ -4,9 +4,9 @@ import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/util
 import { bind, Variable } from 'astal';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers.js';
 import { getIcon } from './helpers/index.js';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { Astal } from 'astal/gtk3';
 import AstalWp from 'gi://AstalWp?version=0.1';
+import { BarBoxChild } from 'src/lib/types/bar.types.js';
 
 const wireplumber = AstalWp.get_default() as AstalWp.Wp;
 const audioService = wireplumber?.audio;
@@ -118,7 +118,9 @@ const Volume = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/weather/index.tsx b/src/components/bar/modules/weather/index.tsx
index caa699a..5ab5633 100644
--- a/src/components/bar/modules/weather/index.tsx
+++ b/src/components/bar/modules/weather/index.tsx
@@ -1,12 +1,13 @@
 import options from 'src/options';
 import { Module } from '../../shared/Module';
 import { inputHandler } from 'src/components/bar/utils/helpers';
-import { getWeatherStatusTextIcon, globalWeatherVar } from 'src/globals/weather';
-import { BarBoxChild } from 'src/lib/types/bar';
+import { getWeatherStatusTextIcon, globalWeatherVar } from 'src/shared/weather';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
-const { label, unit, leftClick, rightClick, middleClick, scrollUp, scrollDown } = options.bar.customModules.weather;
+const { label, unit, leftClick, rightClick, middleClick, scrollUp, scrollDown } =
+    options.bar.customModules.weather;
 
 export const Weather = (): BarBoxChild => {
     const iconBinding = Variable.derive([bind(globalWeatherVar)], (wthr) => {
diff --git a/src/components/bar/modules/window_title/helpers/title.ts b/src/components/bar/modules/window_title/helpers/title.ts
index 04fb3e6..2803262 100644
--- a/src/components/bar/modules/window_title/helpers/title.ts
+++ b/src/components/bar/modules/window_title/helpers/title.ts
@@ -15,7 +15,7 @@ function trackClientUpdates(client: AstalHyprland.Client): void {
     clientBinding?.drop();
     clientBinding = undefined;
 
-    if (!client) {
+    if (client === null) {
         return;
     }
 
@@ -68,7 +68,11 @@ export const getWindowMatch = (hyprlandClient: AstalHyprland.Client): Record<str
  *
  * @returns The title of the window as a string.
  */
-export const getTitle = (client: AstalHyprland.Client, useCustomTitle: boolean, useClassName: boolean): string => {
+export const getTitle = (
+    client: AstalHyprland.Client,
+    useCustomTitle: boolean,
+    useClassName: boolean,
+): string => {
     if (client === null || useCustomTitle) return getWindowMatch(client).label;
 
     const title = client.title;
diff --git a/src/components/bar/modules/window_title/index.tsx b/src/components/bar/modules/window_title/index.tsx
index 62b06f8..27198ff 100644
--- a/src/components/bar/modules/window_title/index.tsx
+++ b/src/components/bar/modules/window_title/index.tsx
@@ -1,11 +1,11 @@
 import { runAsyncCommand, throttledScrollHandler } from 'src/components/bar/utils/helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import options from 'src/options';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
 import { onMiddleClick, onPrimaryClick, onScroll, onSecondaryClick } from 'src/lib/shared/eventHandlers';
 import { bind, Variable } from 'astal';
 import { clientTitle, getTitle, getWindowMatch, truncateTitle } from './helpers/title';
 import { Astal } from 'astal/gtk3';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const hyprlandService = AstalHyprland.get_default();
 const { leftClick, rightClick, middleClick, scrollDown, scrollUp } = options.bar.windowtitle;
@@ -14,7 +14,12 @@ const ClientTitle = (): BarBoxChild => {
     const { custom_title, class_name, label, icon, truncation, truncation_size } = options.bar.windowtitle;
 
     const ClientIcon = ({ client }: ClientIconProps): JSX.Element => {
-        return <label className={'bar-button-icon windowtitle txt-icon bar'} label={getWindowMatch(client).icon} />;
+        return (
+            <label
+                className={'bar-button-icon windowtitle txt-icon bar'}
+                label={getWindowMatch(client).icon}
+            />
+        );
     };
 
     const ClientLabel = ({
@@ -28,7 +33,10 @@ const ClientTitle = (): BarBoxChild => {
         return (
             <label
                 className={`bar-button-label windowtitle ${showIcon ? '' : 'no-icon'}`}
-                label={truncateTitle(getTitle(client, useCustomTitle, useClassName), truncate ? truncationSize : -1)}
+                label={truncateTitle(
+                    getTitle(client, useCustomTitle, useClassName),
+                    truncate ? truncationSize : -1,
+                )}
             />
         );
     };
@@ -131,7 +139,9 @@ const ClientTitle = (): BarBoxChild => {
                             }),
                         );
 
-                        disconnectFunctions.push(onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()));
+                        disconnectFunctions.push(
+                            onScroll(self, throttledHandler, scrollUp.get(), scrollDown.get()),
+                        );
                     },
                 );
             },
diff --git a/src/components/bar/modules/workspaces/helpers/index.ts b/src/components/bar/modules/workspaces/helpers/index.ts
index d9fbf85..2a0b525 100644
--- a/src/components/bar/modules/workspaces/helpers/index.ts
+++ b/src/components/bar/modules/workspaces/helpers/index.ts
@@ -1,6 +1,6 @@
 import { Variable } from 'astal';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
-import { MonitorMap, WorkspaceMonitorMap, WorkspaceRule } from 'src/lib/types/workspace';
+import { MonitorMap, WorkspaceMonitorMap, WorkspaceRule } from 'src/lib/types/workspace.types';
 import { range } from 'src/lib/utils';
 import options from 'src/options';
 
@@ -172,7 +172,7 @@ function isWorkspaceIgnored(ignoredWorkspacesVariable: Variable<string>, workspa
  * @param ignoredWorkspacesVariable - A Variable that contains the ignored workspaces pattern.
  */
 function navigateWorkspace(direction: 'next' | 'prev', ignoredWorkspacesVariable: Variable<string>): void {
-    const allHyprlandWorkspaces = hyprlandService.get_workspaces() || [];
+    const allHyprlandWorkspaces = hyprlandService.get_workspaces() ?? [];
 
     const activeWorkspaceIds = allHyprlandWorkspaces
         .filter((workspaceInstance) => hyprlandService.focusedMonitor.id === workspaceInstance.monitor?.id)
@@ -187,7 +187,8 @@ function navigateWorkspace(direction: 'next' | 'prev', ignoredWorkspacesVariable
     const workspaceIndex = assignedOrOccupiedWorkspaces.indexOf(hyprlandService.focusedWorkspace?.id);
     const step = direction === 'next' ? 1 : -1;
 
-    let newIndex = (workspaceIndex + step + assignedOrOccupiedWorkspaces.length) % assignedOrOccupiedWorkspaces.length;
+    let newIndex =
+        (workspaceIndex + step + assignedOrOccupiedWorkspaces.length) % assignedOrOccupiedWorkspaces.length;
     let attempts = 0;
 
     while (attempts < assignedOrOccupiedWorkspaces.length) {
@@ -196,7 +197,8 @@ function navigateWorkspace(direction: 'next' | 'prev', ignoredWorkspacesVariable
             hyprlandService.dispatch('workspace', targetWorkspaceNumber.toString());
             return;
         }
-        newIndex = (newIndex + step + assignedOrOccupiedWorkspaces.length) % assignedOrOccupiedWorkspaces.length;
+        newIndex =
+            (newIndex + step + assignedOrOccupiedWorkspaces.length) % assignedOrOccupiedWorkspaces.length;
         attempts++;
     }
 }
@@ -321,7 +323,9 @@ export function getWorkspacesToRender(
     );
 
     const activeWorkspacesForCurrentMonitor = activeWorkspaceIds.filter((workspaceId) => {
-        const metadataForWorkspace = allWorkspaceInstances.find((workspaceObj) => workspaceObj.id === workspaceId);
+        const metadataForWorkspace = allWorkspaceInstances.find(
+            (workspaceObj) => workspaceObj.id === workspaceId,
+        );
 
         if (metadataForWorkspace) {
             return metadataForWorkspace?.monitor?.id === monitorId;
@@ -334,6 +338,8 @@ export function getWorkspacesToRender(
         ) {
             return workspaceMonitorRules[currentMonitorInstance.name].includes(workspaceId);
         }
+
+        return false;
     });
 
     if (isMonitorSpecific) {
@@ -347,12 +353,16 @@ export function getWorkspacesToRender(
             );
         });
 
-        allPotentialWorkspaces = [...new Set([...activeWorkspacesForCurrentMonitor, ...validWorkspaceNumbers])];
+        allPotentialWorkspaces = [
+            ...new Set([...activeWorkspacesForCurrentMonitor, ...validWorkspaceNumbers]),
+        ];
     } else {
         allPotentialWorkspaces = [...new Set([...allPotentialWorkspaces, ...activeWorkspaceIds])];
     }
 
-    return allPotentialWorkspaces.filter((workspace) => !isWorkspaceIgnored(ignored, workspace)).sort((a, b) => a - b);
+    return allPotentialWorkspaces
+        .filter((workspace) => !isWorkspaceIgnored(ignored, workspace))
+        .sort((a, b) => a - b);
 }
 
 /**
diff --git a/src/components/bar/modules/workspaces/helpers/utils.ts b/src/components/bar/modules/workspaces/helpers/utils.ts
index 4e80535..cc1773e 100644
--- a/src/components/bar/modules/workspaces/helpers/utils.ts
+++ b/src/components/bar/modules/workspaces/helpers/utils.ts
@@ -1,6 +1,6 @@
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
 import { defaultApplicationIconMap } from 'src/lib/constants/appIcons';
-import { AppIconOptions, WorkspaceIconMap } from 'src/lib/types/workspace';
+import { WorkspaceIconMap, AppIconOptions } from 'src/lib/types/workspace.types';
 import { isValidGjsColor } from 'src/lib/utils';
 import options from 'src/options';
 
@@ -40,7 +40,7 @@ const getWsIcon = (wsIconMap: WorkspaceIconMap, i: number): string => {
     const iconEntry = wsIconMap[i];
     const defaultIcon = `${i}`;
 
-    if (!iconEntry) {
+    if (iconEntry === undefined) {
         return defaultIcon;
     }
 
@@ -77,8 +77,10 @@ export const getWsColor = (
     monitor: number,
 ): string => {
     const iconEntry = wsIconMap[i];
-    const hasColor = typeof iconEntry === 'object' && 'color' in iconEntry && isValidGjsColor(iconEntry.color);
-    if (!iconEntry) {
+    const hasColor =
+        typeof iconEntry === 'object' && 'color' in iconEntry && isValidGjsColor(iconEntry.color);
+
+    if (iconEntry === undefined) {
         return '';
     }
 
@@ -150,7 +152,7 @@ export const getAppIcon = (
     let icons = workspaceClients.reduce((iconAccumulator, [clientClass, clientTitle]) => {
         const icon = findIconForClient(clientClass, clientTitle);
 
-        if (icon) {
+        if (icon !== undefined) {
             iconAccumulator.push(icon);
         }
 
@@ -193,7 +195,8 @@ export const renderClassnames = (
     monitor: number,
     i: number,
 ): string => {
-    const isWorkspaceActive = hyprlandService.focusedWorkspace?.id === i || isWorkspaceActiveOnMonitor(monitor, i);
+    const isWorkspaceActive =
+        hyprlandService.focusedWorkspace?.id === i || isWorkspaceActiveOnMonitor(monitor, i);
     const isActive = isWorkspaceActive ? 'active' : '';
 
     if (showIcons) {
diff --git a/src/components/bar/modules/workspaces/index.tsx b/src/components/bar/modules/workspaces/index.tsx
index 0520097..bf33a1c 100644
--- a/src/components/bar/modules/workspaces/index.tsx
+++ b/src/components/bar/modules/workspaces/index.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
 import { initThrottledScrollHandlers } from './helpers';
-import { BarBoxChild } from 'src/lib/types/bar';
 import { WorkspaceModule } from './workspaces';
 import { bind, Variable } from 'astal';
-import { GtkWidget } from 'src/lib/types/widget';
 import { Astal, Gdk } from 'astal/gtk3';
 import { isScrollDown, isScrollUp } from 'src/lib/utils';
+import { BarBoxChild } from 'src/lib/types/bar.types';
+import { GtkWidget } from 'src/lib/types/widget.types';
 
 const { scroll_speed } = options.bar.workspaces;
 
@@ -29,7 +29,8 @@ const Workspaces = (monitor = -1): BarBoxChild => {
                         self.disconnect(scrollHandlers);
                     }
 
-                    const { throttledScrollUp, throttledScrollDown } = initThrottledScrollHandlers(scroll_speed);
+                    const { throttledScrollUp, throttledScrollDown } =
+                        initThrottledScrollHandlers(scroll_speed);
 
                     scrollHandlers = self.connect('scroll-event', (_: GtkWidget, event: Gdk.Event) => {
                         if (isScrollUp(event)) {
diff --git a/src/components/bar/modules/workspaces/workspaces.tsx b/src/components/bar/modules/workspaces/workspaces.tsx
index a29b200..8be5a2c 100644
--- a/src/components/bar/modules/workspaces/workspaces.tsx
+++ b/src/components/bar/modules/workspaces/workspaces.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
 import { forceUpdater, getWorkspacesToRender, initWorkspaceEvents, workspaceRules } from './helpers';
 import { getAppIcon, getWsColor, renderClassnames, renderLabel } from './helpers/utils';
-import { ApplicationIcons, WorkspaceIconMap } from 'src/lib/types/workspace';
 import { bind, Variable } from 'astal';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
 import { Gtk } from 'astal/gtk3';
 import { isPrimaryClick } from 'src/lib/utils';
+import { WorkspaceIconMap, ApplicationIcons } from 'src/lib/types/workspace.types';
 
 const hyprlandService = AstalHyprland.get_default();
 const {
@@ -145,7 +145,9 @@ export const WorkspaceModule = ({ monitor }: WorkspaceModuleProps): JSX.Element
                                 monitor,
                             )}
                             setup={(self) => {
-                                const currentWsClients = clients.filter((client) => client?.workspace?.id === wsId);
+                                const currentWsClients = clients.filter(
+                                    (client) => client?.workspace?.id === wsId,
+                                );
                                 self.toggleClassName('occupied', currentWsClients.length > 0);
                             }}
                         />
diff --git a/src/components/bar/modules/worldclock/index.tsx b/src/components/bar/modules/worldclock/index.tsx
index 953449d..8693108 100644
--- a/src/components/bar/modules/worldclock/index.tsx
+++ b/src/components/bar/modules/worldclock/index.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
-import { BarBoxChild } from 'src/lib/types/bar.js';
 import { inputHandler } from 'src/components/bar/utils/helpers.js';
 import { bind, Variable } from 'astal';
 import { Astal } from 'astal/gtk3';
-import { systemTime } from 'src/globals/time';
+import { systemTime } from 'src/shared/time';
 import { GLib } from 'astal';
 import { Module } from '../../shared/Module';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 
 const {
     format,
diff --git a/src/components/bar/settings/config.tsx b/src/components/bar/settings/config.tsx
index cf9e246..35bfd1b 100644
--- a/src/components/bar/settings/config.tsx
+++ b/src/components/bar/settings/config.tsx
@@ -24,18 +24,50 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="boolean"
                 />
                 <Option opt={options.bar.customModules.microphone.label} title="Show Label" type="boolean" />
-                <Option opt={options.bar.customModules.microphone.mutedIcon} title="Muted Icon" type="string" />
-                <Option opt={options.bar.customModules.microphone.unmutedIcon} title="Unmuted Icon" type="string" />
-                <Option opt={options.theme.bar.buttons.modules.microphone.spacing} title="Spacing" type="string" />
-                <Option opt={options.bar.customModules.microphone.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.microphone.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.microphone.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.microphone.mutedIcon}
+                    title="Muted Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.microphone.unmutedIcon}
+                    title="Unmuted Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.theme.bar.buttons.modules.microphone.spacing}
+                    title="Spacing"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.microphone.leftClick}
+                    title="Left Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.microphone.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.microphone.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.microphone.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.microphone.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.microphone.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* RAM Section */}
                 <Header title="RAM" />
-                <Option opt={options.theme.bar.buttons.modules.ram.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.ram.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.customModules.ram.icon} title="Ram Icon" type="string" />
                 <Option opt={options.bar.customModules.ram.label} title="Show Label" type="boolean" />
                 <Option opt={options.theme.bar.buttons.modules.ram.spacing} title="Spacing" type="string" />
@@ -60,7 +92,11 @@ export const CustomModuleSettings = (): JSX.Element => {
 
                 {/* CPU Section */}
                 <Header title="CPU" />
-                <Option opt={options.theme.bar.buttons.modules.cpu.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.cpu.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.customModules.cpu.icon} title="Cpu Icon" type="string" />
                 <Option opt={options.bar.customModules.cpu.label} title="Show Label" type="boolean" />
                 <Option opt={options.theme.bar.buttons.modules.cpu.spacing} title="Spacing" type="string" />
@@ -100,9 +136,17 @@ export const CustomModuleSettings = (): JSX.Element => {
                     enums={['imperial', 'metric']}
                 />
                 <Option opt={options.bar.customModules.cpuTemp.showUnit} title="Show Unit" type="boolean" />
-                <Option opt={options.bar.customModules.cpuTemp.icon} title="Cpu Temperature Icon" type="string" />
+                <Option
+                    opt={options.bar.customModules.cpuTemp.icon}
+                    title="Cpu Temperature Icon"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.cpuTemp.label} title="Show Label" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.cpuTemp.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.cpuTemp.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.cpuTemp.round} title="Round" type="boolean" />
                 <Option
                     opt={options.bar.customModules.cpuTemp.pollingInterval}
@@ -113,10 +157,22 @@ export const CustomModuleSettings = (): JSX.Element => {
                     increment={1000}
                 />
                 <Option opt={options.bar.customModules.cpuTemp.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.cpuTemp.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.cpuTemp.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.cpuTemp.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.cpuTemp.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.cpuTemp.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.cpuTemp.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.cpuTemp.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Storage Section */}
                 <Header title="Storage" />
@@ -127,7 +183,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                 />
                 <Option opt={options.bar.customModules.storage.icon} title="Storage Icon" type="string" />
                 <Option opt={options.bar.customModules.storage.label} title="Show Label" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.storage.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.storage.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.storage.labelType}
                     title="Label Type"
@@ -144,8 +204,16 @@ export const CustomModuleSettings = (): JSX.Element => {
                     increment={1000}
                 />
                 <Option opt={options.bar.customModules.storage.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.storage.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.storage.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.storage.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.storage.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
 
                 {/* Netstat Section */}
                 <Header title="Netstat" />
@@ -171,7 +239,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                 />
                 <Option opt={options.bar.customModules.netstat.icon} title="Netstat Icon" type="string" />
                 <Option opt={options.bar.customModules.netstat.label} title="Show Label" type="boolean" />
-                <Option opt={options.bar.customModules.netstat.networkInLabel} title="Network In Label" type="string" />
+                <Option
+                    opt={options.bar.customModules.netstat.networkInLabel}
+                    title="Network In Label"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.netstat.networkOutLabel}
                     title="Network Out Label"
@@ -183,7 +255,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="enum"
                     enums={['GiB', 'MiB', 'KiB', 'auto']}
                 />
-                <Option opt={options.theme.bar.buttons.modules.netstat.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.netstat.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.netstat.labelType}
                     title="Label Type"
@@ -200,8 +276,16 @@ export const CustomModuleSettings = (): JSX.Element => {
                     increment={1000}
                 />
                 <Option opt={options.bar.customModules.netstat.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.netstat.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.netstat.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.netstat.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.netstat.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
 
                 {/* Keyboard Layout Section */}
                 <Header title="Keyboard Layout" />
@@ -210,7 +294,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                     title="Button Border"
                     type="boolean"
                 />
-                <Option opt={options.bar.customModules.kbLayout.icon} title="Keyboard Layout Icon" type="string" />
+                <Option
+                    opt={options.bar.customModules.kbLayout.icon}
+                    title="Keyboard Layout Icon"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.kbLayout.label} title="Show Label" type="boolean" />
                 <Option
                     opt={options.bar.customModules.kbLayout.labelType}
@@ -218,12 +306,28 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="enum"
                     enums={['layout', 'code']}
                 />
-                <Option opt={options.theme.bar.buttons.modules.kbLayout.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.kbLayout.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.kbLayout.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.kbLayout.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.kbLayout.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.kbLayout.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.kbLayout.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.kbLayout.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.kbLayout.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.kbLayout.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Updates Section */}
                 <Header title="Updates" />
@@ -253,7 +357,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                     title="Updates Available Icon"
                     type="string"
                 />
-                <Option opt={options.bar.customModules.updates.icon.updated} title="No Updates Icon" type="string" />
+                <Option
+                    opt={options.bar.customModules.updates.icon.updated}
+                    title="No Updates Icon"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.updates.label} title="Show Label" type="boolean" />
                 <Option
                     opt={options.bar.customModules.updates.autoHide}
@@ -262,7 +370,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="boolean"
                 />
                 <Option opt={options.bar.customModules.updates.padZero} title="Pad with 0" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.updates.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.updates.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.updates.pollingInterval}
                     title="Polling Interval"
@@ -273,10 +385,22 @@ export const CustomModuleSettings = (): JSX.Element => {
                     increment={1000}
                 />
                 <Option opt={options.bar.customModules.updates.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.updates.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.updates.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.updates.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.updates.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.updates.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.updates.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.updates.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Submap Section */}
                 <Header title="Submap" />
@@ -291,15 +415,39 @@ export const CustomModuleSettings = (): JSX.Element => {
                     subtitle="Displays current submap name instead of Enabled/Disabled text."
                     type="boolean"
                 />
-                <Option opt={options.bar.customModules.submap.enabledIcon} title="Enabled Icon" type="string" />
-                <Option opt={options.bar.customModules.submap.disabledIcon} title="Disabled Icon" type="string" />
-                <Option opt={options.bar.customModules.submap.enabledText} title="Enabled Text" type="string" />
-                <Option opt={options.bar.customModules.submap.disabledText} title="Disabled Text" type="string" />
+                <Option
+                    opt={options.bar.customModules.submap.enabledIcon}
+                    title="Enabled Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.submap.disabledIcon}
+                    title="Disabled Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.submap.enabledText}
+                    title="Enabled Text"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.submap.disabledText}
+                    title="Disabled Text"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.submap.label} title="Show Label" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.submap.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.submap.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.submap.leftClick} title="Left Click" type="string" />
                 <Option opt={options.bar.customModules.submap.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.submap.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.submap.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.submap.scrollUp} title="Scroll Up" type="string" />
                 <Option opt={options.bar.customModules.submap.scrollDown} title="Scroll Down" type="string" />
 
@@ -317,12 +465,28 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="enum"
                     enums={['imperial', 'metric']}
                 />
-                <Option opt={options.theme.bar.buttons.modules.weather.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.weather.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.weather.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.weather.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.weather.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.weather.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.weather.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.weather.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.weather.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.weather.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Hyprsunset Section */}
                 <Header title="Hyprsunset" />
@@ -337,12 +501,32 @@ export const CustomModuleSettings = (): JSX.Element => {
                     title="Button Border"
                     type="boolean"
                 />
-                <Option opt={options.bar.customModules.hyprsunset.onIcon} title="Enabled Icon" type="string" />
-                <Option opt={options.bar.customModules.hyprsunset.offIcon} title="Disabled Icon" type="string" />
-                <Option opt={options.bar.customModules.hyprsunset.onLabel} title="Enabled Label" type="string" />
-                <Option opt={options.bar.customModules.hyprsunset.offLabel} title="Disabled Label" type="string" />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.onIcon}
+                    title="Enabled Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.offIcon}
+                    title="Disabled Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.onLabel}
+                    title="Enabled Label"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.offLabel}
+                    title="Disabled Label"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.hyprsunset.label} title="Show Label" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.hyprsunset.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.hyprsunset.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.hyprsunset.pollingInterval}
                     title="Polling Interval"
@@ -351,10 +535,22 @@ export const CustomModuleSettings = (): JSX.Element => {
                     max={60 * 24 * 1000}
                     increment={1000}
                 />
-                <Option opt={options.bar.customModules.hyprsunset.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.hyprsunset.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.hyprsunset.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.hyprsunset.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.hyprsunset.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Hypridle Section */}
                 <Header title="Hypridle" />
@@ -364,11 +560,27 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="boolean"
                 />
                 <Option opt={options.bar.customModules.hypridle.onIcon} title="Enabled Icon" type="string" />
-                <Option opt={options.bar.customModules.hypridle.offIcon} title="Disabled Icon" type="string" />
-                <Option opt={options.bar.customModules.hypridle.onLabel} title="Enabled Label" type="string" />
-                <Option opt={options.bar.customModules.hypridle.offLabel} title="Disabled Label" type="string" />
+                <Option
+                    opt={options.bar.customModules.hypridle.offIcon}
+                    title="Disabled Icon"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hypridle.onLabel}
+                    title="Enabled Label"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hypridle.offLabel}
+                    title="Disabled Label"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.hypridle.label} title="Show Label" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.hypridle.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.hypridle.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.hypridle.pollingInterval}
                     title="Polling Interval"
@@ -377,10 +589,22 @@ export const CustomModuleSettings = (): JSX.Element => {
                     max={60 * 24 * 1000}
                     increment={1000}
                 />
-                <Option opt={options.bar.customModules.hypridle.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.hypridle.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.hypridle.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.hypridle.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.hypridle.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.hypridle.scrollDown} title="Scroll Down" type="string" />
+                <Option
+                    opt={options.bar.customModules.hypridle.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
 
                 {/* Cava Section */}
                 <Header title="Cava" />
@@ -392,8 +616,16 @@ export const CustomModuleSettings = (): JSX.Element => {
                 <Option opt={options.bar.customModules.cava.icon} title="Icon" type="string" />
                 <Option opt={options.bar.customModules.cava.showIcon} title="Show Icon" type="boolean" />
                 <Option opt={options.theme.bar.buttons.modules.cava.spacing} title="Spacing" type="string" />
-                <Option opt={options.bar.customModules.cava.barCharacters} title="Bar Characters" type="object" />
-                <Option opt={options.bar.customModules.cava.spaceCharacter} title="Bar Separator" type="string" />
+                <Option
+                    opt={options.bar.customModules.cava.barCharacters}
+                    title="Bar Characters"
+                    type="object"
+                />
+                <Option
+                    opt={options.bar.customModules.cava.spaceCharacter}
+                    title="Bar Separator"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.customModules.cava.showActiveOnly}
                     title="Auto Hide"
@@ -411,7 +643,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                 />
                 <Option opt={options.bar.customModules.cava.lowCutoff} title="Low Cutoff" type="number" />
                 <Option opt={options.bar.customModules.cava.highCutoff} title="High Cutoff" type="number" />
-                <Option opt={options.bar.customModules.cava.noiseReduction} title="Noise Reduction" type="float" />
+                <Option
+                    opt={options.bar.customModules.cava.noiseReduction}
+                    title="Noise Reduction"
+                    type="float"
+                />
                 <Option opt={options.bar.customModules.cava.stereo} title="Stereo" type="boolean" />
                 <Option opt={options.bar.customModules.cava.leftClick} title="Left Click" type="string" />
                 <Option opt={options.bar.customModules.cava.rightClick} title="Right Click" type="string" />
@@ -427,8 +663,16 @@ export const CustomModuleSettings = (): JSX.Element => {
                     type="boolean"
                 />
                 <Option opt={options.bar.customModules.worldclock.icon} title="Icon" type="string" />
-                <Option opt={options.bar.customModules.worldclock.showIcon} title="Show Icon" type="boolean" />
-                <Option opt={options.theme.bar.buttons.modules.worldclock.spacing} title="Spacing" type="string" />
+                <Option
+                    opt={options.bar.customModules.worldclock.showIcon}
+                    title="Show Icon"
+                    type="boolean"
+                />
+                <Option
+                    opt={options.theme.bar.buttons.modules.worldclock.spacing}
+                    title="Spacing"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.worldclock.format} title="Format" type="string" />
                 <Option
                     opt={options.bar.customModules.worldclock.formatDiffDate}
@@ -436,13 +680,37 @@ export const CustomModuleSettings = (): JSX.Element => {
                     subtitle="Format to use when the timezone is on a different calendar day than the local timezone."
                     type="string"
                 />
-                <Option opt={options.bar.customModules.worldclock.divider} title="Date Divider" type="string" />
-                <Option opt={options.bar.customModules.worldclock.leftClick} title="Left Click" type="string" />
-                <Option opt={options.bar.customModules.worldclock.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.worldclock.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.worldclock.divider}
+                    title="Date Divider"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.worldclock.leftClick}
+                    title="Left Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.worldclock.rightClick}
+                    title="Right Click"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.worldclock.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.worldclock.scrollUp} title="Scroll Up" type="string" />
-                <Option opt={options.bar.customModules.worldclock.scrollDown} title="Scroll Down" type="string" />
-                <Option opt={options.bar.customModules.worldclock.tz} title="Timezones Displayed" type="object" />
+                <Option
+                    opt={options.bar.customModules.worldclock.scrollDown}
+                    title="Scroll Down"
+                    type="string"
+                />
+                <Option
+                    opt={options.bar.customModules.worldclock.tz}
+                    title="Timezones Displayed"
+                    type="object"
+                />
 
                 {/* Power Section */}
                 <Header title="Power" />
@@ -455,7 +723,11 @@ export const CustomModuleSettings = (): JSX.Element => {
                 <Option opt={options.bar.customModules.power.icon} title="Power Button Icon" type="string" />
                 <Option opt={options.bar.customModules.power.leftClick} title="Left Click" type="string" />
                 <Option opt={options.bar.customModules.power.rightClick} title="Right Click" type="string" />
-                <Option opt={options.bar.customModules.power.middleClick} title="Middle Click" type="string" />
+                <Option
+                    opt={options.bar.customModules.power.middleClick}
+                    title="Middle Click"
+                    type="string"
+                />
                 <Option opt={options.bar.customModules.power.scrollUp} title="Scroll Up" type="string" />
                 <Option opt={options.bar.customModules.power.scrollDown} title="Scroll Down" type="string" />
             </box>
diff --git a/src/components/bar/settings/theme.tsx b/src/components/bar/settings/theme.tsx
index 823ff6e..aa015cf 100644
--- a/src/components/bar/settings/theme.tsx
+++ b/src/components/bar/settings/theme.tsx
@@ -32,13 +32,21 @@ export const CustomModuleTheme = (): JSX.Element => {
                     }
                     type="color"
                 />
-                <Option opt={options.theme.bar.buttons.modules.microphone.border} title="Border" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.microphone.border}
+                    title="Border"
+                    type="color"
+                />
 
                 {/* RAM Module Section */}
                 <Header title="RAM" />
                 <Option opt={options.theme.bar.buttons.modules.ram.text} title="Text" type="color" />
                 <Option opt={options.theme.bar.buttons.modules.ram.icon} title="Icon" type="color" />
-                <Option opt={options.theme.bar.buttons.modules.ram.background} title="Label Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.ram.background}
+                    title="Label Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.buttons.modules.ram.icon_background}
                     title="Icon Background"
@@ -54,7 +62,11 @@ export const CustomModuleTheme = (): JSX.Element => {
                 <Header title="CPU" />
                 <Option opt={options.theme.bar.buttons.modules.cpu.text} title="Text" type="color" />
                 <Option opt={options.theme.bar.buttons.modules.cpu.icon} title="Icon" type="color" />
-                <Option opt={options.theme.bar.buttons.modules.cpu.background} title="Label Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.cpu.background}
+                    title="Label Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.buttons.modules.cpu.icon_background}
                     title="Icon Background"
@@ -224,7 +236,11 @@ export const CustomModuleTheme = (): JSX.Element => {
                     }
                     type="color"
                 />
-                <Option opt={options.theme.bar.buttons.modules.hyprsunset.border} title="Border" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.hyprsunset.border}
+                    title="Border"
+                    type="color"
+                />
 
                 {/* Hypridle Module Section */}
                 <Header title="Hypridle" />
@@ -250,7 +266,11 @@ export const CustomModuleTheme = (): JSX.Element => {
                 <Header title="Cava" />
                 <Option opt={options.theme.bar.buttons.modules.cava.text} title="Bars" type="color" />
                 <Option opt={options.theme.bar.buttons.modules.cava.icon} title="Icon" type="color" />
-                <Option opt={options.theme.bar.buttons.modules.cava.background} title="Label Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.cava.background}
+                    title="Label Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.buttons.modules.cava.icon_background}
                     title="Icon Background"
@@ -280,7 +300,11 @@ export const CustomModuleTheme = (): JSX.Element => {
                     }
                     type="color"
                 />
-                <Option opt={options.theme.bar.buttons.modules.worldclock.border} title="Border" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.modules.worldclock.border}
+                    title="Border"
+                    type="color"
+                />
 
                 {/* Power Module Section */}
                 <Header title="Power" />
diff --git a/src/components/bar/shared/Module.tsx b/src/components/bar/shared/Module.tsx
index 284e323..add7fbb 100644
--- a/src/components/bar/shared/Module.tsx
+++ b/src/components/bar/shared/Module.tsx
@@ -1,6 +1,6 @@
 import { bind, Variable } from 'astal';
-import { BarBoxChild, BarModule } from 'src/lib/types/bar';
-import { BarButtonStyles } from 'src/lib/types/options';
+import { BarBoxChild, BarModuleProps } from 'src/lib/types/bar.types';
+import { BarButtonStyles } from 'src/lib/options/options.types';
 import options from 'src/options';
 
 const { style } = options.theme.bar.buttons;
@@ -17,20 +17,20 @@ export const Module = ({
     props = {},
     showLabelBinding = bind(Variable(true)),
     showIconBinding = bind(Variable(true)),
-    showLabel,
+    showLabel = true,
     labelHook,
     hook,
-}: BarModule): BarBoxChild => {
+}: BarModuleProps): BarBoxChild => {
     const getIconWidget = (useTxtIcn: boolean): JSX.Element | undefined => {
         const className = `txt-icon bar-button-icon module-icon ${boxClass}`;
 
         const icn = typeof icon === 'string' ? icon : icon?.get();
-        if (!useTxtIcn && icn?.length) {
+        if (!useTxtIcn && icn !== undefined && icn.length > 0) {
             return <icon className={className} icon={icon} />;
         }
 
         const textIcn = typeof textIcon === 'string' ? textIcon : textIcon?.get();
-        if (textIcn?.length) {
+        if (textIcn !== undefined && textIcn.length > 0) {
             return <label className={className} label={textIcon} />;
         }
     };
diff --git a/src/components/bar/shared/WidgetContainer.tsx b/src/components/bar/shared/WidgetContainer.tsx
index 9ed9a58..2c25c56 100644
--- a/src/components/bar/shared/WidgetContainer.tsx
+++ b/src/components/bar/shared/WidgetContainer.tsx
@@ -1,15 +1,14 @@
-import { BarBoxChild } from 'src/lib/types/bar';
-import { Bind } from '../../../lib/types/variable';
+import { BarBoxChild } from 'src/lib/types/bar.types';
 import options from '../../../options';
-import { bind } from 'astal';
+import { bind, Binding } from 'astal';
 
-const computeVisible = (child: BarBoxChild): Bind | boolean => {
+const computeVisible = (child: BarBoxChild): Binding<boolean> | boolean => {
     if (child.isVis !== undefined) {
-        return bind(child.isVis);
+        return child.isVis;
     }
-    return child.isVisible;
-};
 
+    return child.isVisible ?? true;
+};
 export const WidgetContainer = (child: BarBoxChild): JSX.Element => {
     const buttonClassName = bind(options.theme.bar.buttons.style).as((style) => {
         const styleMap = {
@@ -24,7 +23,7 @@ export const WidgetContainer = (child: BarBoxChild): JSX.Element => {
         return `bar_item_box_visible ${styleMap[style]} ${boxClassName}`;
     });
 
-    if (child.isBox) {
+    if (child.isBox === true) {
         return (
             <eventbox visible={computeVisible(child)} {...child.props}>
                 <box className={buttonClassName}>{child.component}</box>
diff --git a/src/components/bar/utils/GdkMonitorMapper.ts b/src/components/bar/utils/GdkMonitorMapper.ts
index 9d0485a..77cc98c 100644
--- a/src/components/bar/utils/GdkMonitorMapper.ts
+++ b/src/components/bar/utils/GdkMonitorMapper.ts
@@ -8,20 +8,20 @@ const hyprlandService = AstalHyprland.get_default();
  * It maintains internal state for monitors that have already been used so that duplicate assignments are avoided.
  */
 export class GdkMonitorMapper {
-    private usedGdkMonitors: Set<number>;
-    private usedHyprlandMonitors: Set<number>;
+    private _usedGdkMonitors: Set<number>;
+    private _usedHyprlandMonitors: Set<number>;
 
     constructor() {
-        this.usedGdkMonitors = new Set();
-        this.usedHyprlandMonitors = new Set();
+        this._usedGdkMonitors = new Set();
+        this._usedHyprlandMonitors = new Set();
     }
 
     /**
      * Resets the internal state for both GDK and Hyprland monitor mappings.
      */
     public reset(): void {
-        this.usedGdkMonitors.clear();
-        this.usedHyprlandMonitors.clear();
+        this._usedGdkMonitors.clear();
+        this._usedHyprlandMonitors.clear();
     }
 
     /**
@@ -44,7 +44,7 @@ export class GdkMonitorMapper {
             hyprlandMonitors,
             gdkMonitor,
             monitor,
-            this.usedHyprlandMonitors,
+            this._usedHyprlandMonitors,
             (mon) => mon.id,
             (mon, gdkMon) => this._matchMonitorKey(mon, gdkMon),
         );
@@ -68,13 +68,14 @@ export class GdkMonitorMapper {
         }
 
         const hyprlandMonitors = hyprlandService.get_monitors();
-        const foundHyprlandMonitor = hyprlandMonitors.find((mon) => mon.id === monitor) || hyprlandMonitors[0];
+        const foundHyprlandMonitor =
+            hyprlandMonitors.find((mon) => mon.id === monitor) || hyprlandMonitors[0];
 
         return this._matchMonitor(
             gdkCandidates,
             foundHyprlandMonitor,
             monitor,
-            this.usedGdkMonitors,
+            this._usedGdkMonitors,
             (candidate) => candidate.id,
             (candidate, hyprlandMonitor) => this._matchMonitorKey(hyprlandMonitor, candidate.monitor),
         );
@@ -105,7 +106,9 @@ export class GdkMonitorMapper {
         // Direct match: candidate matches the source and has the same id as the target.
         const directMatch = candidates.find(
             (candidate) =>
-                compare(candidate, source) && !usedMonitors.has(getId(candidate)) && getId(candidate) === target,
+                compare(candidate, source) &&
+                !usedMonitors.has(getId(candidate)) &&
+                getId(candidate) === target,
         );
 
         if (directMatch !== undefined) {
@@ -202,7 +205,7 @@ export class GdkMonitorMapper {
                 continue;
             }
 
-            const model = curMonitor.get_model() || '';
+            const model = curMonitor.get_model() ?? '';
             const geometry = curMonitor.get_geometry();
             const scaleFactor = curMonitor.get_scale_factor();
 
diff --git a/src/components/bar/utils/helpers.ts b/src/components/bar/utils/helpers.ts
index 96f0a4b..5705c30 100644
--- a/src/components/bar/utils/helpers.ts
+++ b/src/components/bar/utils/helpers.ts
@@ -1,14 +1,18 @@
-import { ResourceLabelType } from 'src/lib/types/bar';
-import { GenericResourceData, Postfix, UpdateHandlers } from 'src/lib/types/customModules/generic';
-import { InputHandlerEventArgs, InputHandlerEvents, RunAsyncCommand } from 'src/lib/types/customModules/utils';
-import { ThrottleFn } from 'src/lib/types/utils';
 import { bind, Binding, execAsync, Variable } from 'astal';
 import { openMenu } from 'src/components/bar/utils/menu';
 import options from 'src/options';
 import { Gdk } from 'astal/gtk3';
-import { GtkWidget } from 'src/lib/types/widget';
 import { onMiddleClick, onPrimaryClick, onSecondaryClick } from 'src/lib/shared/eventHandlers';
 import { isScrollDown, isScrollUp } from 'src/lib/utils';
+import { ResourceLabelType } from 'src/lib/types/bar.types';
+import { UpdateHandlers, Postfix, GenericResourceData } from 'src/lib/types/customModules/generic.types';
+import {
+    RunAsyncCommand,
+    InputHandlerEvents,
+    InputHandlerEventArgs,
+} from 'src/lib/types/customModules/utils.types';
+import { ThrottleFn } from 'src/lib/types/utils.types';
+import { GtkWidget } from 'src/lib/types/widget.types';
 
 const { scrollSpeed } = options.bar.customModules;
 
@@ -38,7 +42,12 @@ const handlePostInputUpdater = (postInputUpdater?: Variable<boolean>): void => {
  * @param fn An optional callback function to handle the command output.
  * @param postInputUpdater An optional Variable<boolean> that tracks the post input update state.
  */
-export const runAsyncCommand: RunAsyncCommand = (cmd, events, fn, postInputUpdater?: Variable<boolean>): void => {
+export const runAsyncCommand: RunAsyncCommand = (
+    cmd,
+    events,
+    fn,
+    postInputUpdater?: Variable<boolean>,
+): void => {
     if (cmd.startsWith('menu:')) {
         const menuName = cmd.split(':')[1].trim().toLowerCase();
         openMenu(events.clicked, events.event, `${menuName}menu`);
@@ -61,7 +70,8 @@ export const runAsyncCommand: RunAsyncCommand = (cmd, events, fn, postInputUpdat
  * which undo the toggle.
  */
 const throttledAsyncCommand = throttleInput(
-    (cmd, events, fn, postInputUpdater?: Variable<boolean>) => runAsyncCommand(cmd, events, fn, postInputUpdater),
+    (cmd, events, fn, postInputUpdater?: Variable<boolean>) =>
+        runAsyncCommand(cmd, events, fn, postInputUpdater),
     50,
 );
 
@@ -165,7 +175,12 @@ export const inputHandler = (
         const id = self.connect('scroll-event', (self: GtkWidget, event: Gdk.Event) => {
             const handleScroll = (input?: InputHandlerEventArgs): void => {
                 if (input) {
-                    throttledHandler(sanitizeInput(input.cmd), { clicked: self, event }, input.fn, postInputUpdater);
+                    throttledHandler(
+                        sanitizeInput(input.cmd),
+                        { clicked: self, event },
+                        input.fn,
+                        postInputUpdater,
+                    );
                 }
             };
 
@@ -344,7 +359,11 @@ export const getPostfix = (sizeInBytes: number): Postfix => {
  *
  * @returns The rendered resource label as a string.
  */
-export const renderResourceLabel = (lblType: ResourceLabelType, rmUsg: GenericResourceData, round: boolean): string => {
+export const renderResourceLabel = (
+    lblType: ResourceLabelType,
+    rmUsg: GenericResourceData,
+    round: boolean,
+): string => {
     const { used, total, percentage, free } = rmUsg;
 
     const formatFunctions = {
@@ -361,7 +380,7 @@ export const renderResourceLabel = (lblType: ResourceLabelType, rmUsg: GenericRe
     const postfix = getPostfix(total);
 
     // Determine which format function to use
-    const formatUsed = formatFunctions[postfix] || formatFunctions['B'];
+    const formatUsed = formatFunctions[postfix] ?? formatFunctions['B'];
     const usedSizeFormatted = formatUsed(used, round);
 
     if (lblType === 'used/total') {
diff --git a/src/components/bar/utils/menu.ts b/src/components/bar/utils/menu.ts
index 43c951d..9e2e222 100644
--- a/src/components/bar/utils/menu.ts
+++ b/src/components/bar/utils/menu.ts
@@ -1,5 +1,5 @@
 import { App, Gdk } from 'astal/gtk3';
-import { GtkWidget } from 'src/lib/types/widget';
+import { GtkWidget } from 'src/lib/types/widget.types';
 import { calculateMenuPosition } from 'src/components/menus/shared/dropdown/locationHandler';
 
 export const closeAllMenus = (): void => {
diff --git a/src/components/bar/utils/monitors.ts b/src/components/bar/utils/monitors.ts
index 2ad2a60..18cd8d6 100644
--- a/src/components/bar/utils/monitors.ts
+++ b/src/components/bar/utils/monitors.ts
@@ -1,4 +1,4 @@
-import { BarLayout, BarLayouts } from 'src/lib/types/options';
+import { BarLayout, BarLayouts } from 'src/lib/options/options.types';
 
 /**
  * Returns the bar layout configuration for a specific monitor
@@ -11,7 +11,7 @@ export const getLayoutForMonitor = (monitor: number, layouts: BarLayouts): BarLa
     const matchingKey = Object.keys(layouts).find((key) => key === monitor.toString());
     const wildcard = Object.keys(layouts).find((key) => key === '*');
 
-    if (matchingKey) {
+    if (matchingKey !== undefined) {
         return layouts[matchingKey];
     }
 
diff --git a/src/components/menus/audio/active/devices/index.tsx b/src/components/menus/audio/active/devices/index.tsx
index 5cc1a9d..65d9843 100644
--- a/src/components/menus/audio/active/devices/index.tsx
+++ b/src/components/menus/audio/active/devices/index.tsx
@@ -7,7 +7,7 @@ const audioService = wireplumber.audio;
 
 const ActiveDeviceContainer = ({ children }: ActiveDeviceContainerProps): JSX.Element => {
     return (
-        <box className={'menu-items-section selected'} name={ActiveDeviceMenu.Devices} vertical>
+        <box className={'menu-items-section selected'} name={ActiveDeviceMenu.DEVICES} vertical>
             {children}
         </box>
     );
diff --git a/src/components/menus/audio/active/index.tsx b/src/components/menus/audio/active/index.tsx
index 708429d..102a58d 100644
--- a/src/components/menus/audio/active/index.tsx
+++ b/src/components/menus/audio/active/index.tsx
@@ -5,11 +5,11 @@ import { bind, Variable } from 'astal';
 import { isPrimaryClick } from 'src/lib/utils.js';
 
 export enum ActiveDeviceMenu {
-    Devices = 'devices',
-    Playbacks = 'playbacks',
+    DEVICES = 'devices',
+    PLAYBACKS = 'playbacks',
 }
 
-const activeMenu: Variable<ActiveDeviceMenu> = Variable(ActiveDeviceMenu.Devices);
+const activeMenu: Variable<ActiveDeviceMenu> = Variable(ActiveDeviceMenu.DEVICES);
 
 const Header = (): JSX.Element => (
     <box className={'menu-label-container volume selected'} halign={Gtk.Align.FILL}>
@@ -21,15 +21,15 @@ const Header = (): JSX.Element => (
                     return;
                 }
 
-                if (activeMenu.get() === ActiveDeviceMenu.Devices) {
-                    activeMenu.set(ActiveDeviceMenu.Playbacks);
+                if (activeMenu.get() === ActiveDeviceMenu.DEVICES) {
+                    activeMenu.set(ActiveDeviceMenu.PLAYBACKS);
                 } else {
-                    activeMenu.set(ActiveDeviceMenu.Devices);
+                    activeMenu.set(ActiveDeviceMenu.DEVICES);
                 }
             }}
             halign={Gtk.Align.END}
             hexpand
-            label={bind(activeMenu).as((menu) => (menu === ActiveDeviceMenu.Devices ? '' : '󰤽'))}
+            label={bind(activeMenu).as((menu) => (menu === ActiveDeviceMenu.DEVICES ? '' : '󰤽'))}
         />
     </box>
 );
@@ -40,13 +40,13 @@ export const VolumeSliders = (): JSX.Element => {
             <Header />
             <revealer
                 transitionType={Gtk.RevealerTransitionType.NONE}
-                revealChild={bind(activeMenu).as((curMenu) => curMenu === ActiveDeviceMenu.Devices)}
+                revealChild={bind(activeMenu).as((curMenu) => curMenu === ActiveDeviceMenu.DEVICES)}
             >
                 <ActiveDevices />
             </revealer>
             <revealer
                 transitionType={Gtk.RevealerTransitionType.NONE}
-                revealChild={bind(activeMenu).as((curMenu) => curMenu === ActiveDeviceMenu.Playbacks)}
+                revealChild={bind(activeMenu).as((curMenu) => curMenu === ActiveDeviceMenu.PLAYBACKS)}
             >
                 <ActivePlaybacks />
             </revealer>
diff --git a/src/components/menus/audio/active/playbacks/index.tsx b/src/components/menus/audio/active/playbacks/index.tsx
index 06624cd..844d8de 100644
--- a/src/components/menus/audio/active/playbacks/index.tsx
+++ b/src/components/menus/audio/active/playbacks/index.tsx
@@ -12,11 +12,11 @@ const NoStreams = (): JSX.Element => {
 
 export const ActivePlaybacks = (): JSX.Element => {
     return (
-        <box className={'menu-items-section selected'} name={ActiveDeviceMenu.Playbacks} vertical>
+        <box className={'menu-items-section selected'} name={ActiveDeviceMenu.PLAYBACKS} vertical>
             <scrollable className={'menu-scroller active-playbacks-scrollable'}>
                 <box vertical>
                     {bind(audioService, 'streams').as((streams) => {
-                        if (!streams || streams.length === 0) {
+                        if (streams === null || streams.length === 0) {
                             return <NoStreams />;
                         }
 
diff --git a/src/components/menus/audio/active/sliderItem/Slider.tsx b/src/components/menus/audio/active/sliderItem/Slider.tsx
index 5464913..f4a33b3 100644
--- a/src/components/menus/audio/active/sliderItem/Slider.tsx
+++ b/src/components/menus/audio/active/sliderItem/Slider.tsx
@@ -28,8 +28,8 @@ export const Slider = ({ device, type }: SliderProps): JSX.Element => {
                 max={type === 'playback' ? bind(raiseMaximumVolume).as((raise) => (raise ? 1.5 : 1)) : 1}
                 onDragged={({ value, dragging }) => {
                     if (dragging) {
-                        device.volume = value;
-                        device.mute = false;
+                        device.set_volume(value);
+                        device.set_mute(false);
                     }
                 }}
                 setup={(self) => {
diff --git a/src/components/menus/audio/active/sliderItem/SliderIcon.tsx b/src/components/menus/audio/active/sliderItem/SliderIcon.tsx
index 05f40ef..4e7067a 100644
--- a/src/components/menus/audio/active/sliderItem/SliderIcon.tsx
+++ b/src/components/menus/audio/active/sliderItem/SliderIcon.tsx
@@ -16,12 +16,14 @@ export const SliderIcon = ({ type, device }: SliderIconProps): JSX.Element => {
 
     return (
         <button
-            className={bind(device, 'mute').as((isMuted) => `menu-active-button ${type} ${isMuted ? 'muted' : ''}`)}
+            className={bind(device, 'mute').as(
+                (isMuted) => `menu-active-button ${type} ${isMuted ? 'muted' : ''}`,
+            )}
             vexpand={false}
             valign={Gtk.Align.END}
             onClick={(_, event) => {
                 if (isPrimaryClick(event)) {
-                    device.mute = !device.mute;
+                    device.set_mute(!device.mute);
                 }
             }}
             onDestroy={() => {
diff --git a/src/components/menus/audio/available/Device.tsx b/src/components/menus/audio/available/Device.tsx
index dcb5c5b..775c3ea 100644
--- a/src/components/menus/audio/available/Device.tsx
+++ b/src/components/menus/audio/available/Device.tsx
@@ -20,7 +20,9 @@ const DeviceName = ({ device, type }: Omit<AudioDeviceProps, 'icon'>): JSX.Eleme
             truncate
             wrap
             className={bind(device, 'description').as((currentDesc) =>
-                device.description === currentDesc ? `menu-button-name active ${type}` : `menu-button-name ${type}`,
+                device.description === currentDesc
+                    ? `menu-button-name active ${type}`
+                    : `menu-button-name ${type}`,
             )}
             label={device.description}
         />
diff --git a/src/components/menus/audio/available/InputDevices.tsx b/src/components/menus/audio/available/InputDevices.tsx
index 1189f4d..a82c5c4 100644
--- a/src/components/menus/audio/available/InputDevices.tsx
+++ b/src/components/menus/audio/available/InputDevices.tsx
@@ -13,7 +13,7 @@ export const InputDevices = (): JSX.Element => {
         <box className={'menu-items-section input'} vertical>
             <box className={'menu-container input'} vertical>
                 {inputDevices.as((devices) => {
-                    if (!devices || devices.length === 0) {
+                    if (devices === null || devices.length === 0) {
                         return <NotFoundButton type={'input'} />;
                     }
 
diff --git a/src/components/menus/audio/available/PlaybackDevices.tsx b/src/components/menus/audio/available/PlaybackDevices.tsx
index 09383b0..681ccde 100644
--- a/src/components/menus/audio/available/PlaybackDevices.tsx
+++ b/src/components/menus/audio/available/PlaybackDevices.tsx
@@ -13,7 +13,7 @@ export const PlaybackDevices = (): JSX.Element => {
         <box className={'menu-items-section playback'} vertical>
             <box className={'menu-container playback'} vertical>
                 {playbackDevices.as((devices) => {
-                    if (!devices || devices.length === 0) {
+                    if (devices === null || devices.length === 0) {
                         return <NotFoundButton type={'playback'} />;
                     }
 
diff --git a/src/components/menus/audio/utils.ts b/src/components/menus/audio/utils.ts
index dc6b07e..30e40cd 100644
--- a/src/components/menus/audio/utils.ts
+++ b/src/components/menus/audio/utils.ts
@@ -29,7 +29,7 @@ type IconVolumes = keyof typeof speakerIcons;
  */
 const getIcon = (audioVol: number, isMuted: boolean): Record<string, string> => {
     const thresholds: IconVolumes[] = [101, 66, 34, 1, 0];
-    const icon = isMuted ? 0 : thresholds.find((threshold) => threshold <= audioVol * 100) || 0;
+    const icon = isMuted ? 0 : (thresholds.find((threshold) => threshold <= audioVol * 100) ?? 0);
 
     return {
         spkr: speakerIcons[icon],
diff --git a/src/components/menus/bluetooth/devices/BluetoothDisabled.tsx b/src/components/menus/bluetooth/devices/BluetoothDisabled.tsx
index 691abe7..317c48c 100644
--- a/src/components/menus/bluetooth/devices/BluetoothDisabled.tsx
+++ b/src/components/menus/bluetooth/devices/BluetoothDisabled.tsx
@@ -2,7 +2,13 @@ import { Gtk } from 'astal/gtk3';
 
 export const BluetoothDisabled = (): JSX.Element => {
     return (
-        <box className={'bluetooth-items'} vertical expand valign={Gtk.Align.CENTER} halign={Gtk.Align.CENTER}>
+        <box
+            className={'bluetooth-items'}
+            vertical
+            expand
+            valign={Gtk.Align.CENTER}
+            halign={Gtk.Align.CENTER}
+        >
             <label className={'bluetooth-disabled dim'} hexpand label={'Bluetooth is disabled'} />
         </box>
     );
diff --git a/src/components/menus/bluetooth/devices/NoBluetoothDevices.tsx b/src/components/menus/bluetooth/devices/NoBluetoothDevices.tsx
index e4ef7eb..f953b2e 100644
--- a/src/components/menus/bluetooth/devices/NoBluetoothDevices.tsx
+++ b/src/components/menus/bluetooth/devices/NoBluetoothDevices.tsx
@@ -2,7 +2,13 @@ import { Gtk } from 'astal/gtk3';
 
 export const NoBluetoothDevices = (): JSX.Element => {
     return (
-        <box className={'bluetooth-items'} vertical expand valign={Gtk.Align.CENTER} halign={Gtk.Align.CENTER}>
+        <box
+            className={'bluetooth-items'}
+            vertical
+            expand
+            valign={Gtk.Align.CENTER}
+            halign={Gtk.Align.CENTER}
+        >
             <label className={'no-bluetooth-devices dim'} hexpand label={'No devices currently found'} />
             <label className={'search-bluetooth-label dim'} hexpand label={"Press '󰑐' to search"} />
         </box>
diff --git a/src/components/menus/bluetooth/devices/controls/ActionButton.tsx b/src/components/menus/bluetooth/devices/controls/ActionButton.tsx
index 57a9d90..486f12d 100644
--- a/src/components/menus/bluetooth/devices/controls/ActionButton.tsx
+++ b/src/components/menus/bluetooth/devices/controls/ActionButton.tsx
@@ -1,7 +1,12 @@
 import { Binding } from 'astal';
 import { ButtonProps } from 'astal/gtk3/widget';
 
-export const ActionButton = ({ name = '', tooltipText = '', label = '', ...props }: ActionButtonProps): JSX.Element => {
+export const ActionButton = ({
+    name = '',
+    tooltipText = '',
+    label = '',
+    ...props
+}: ActionButtonProps): JSX.Element => {
     return (
         <button className={`menu-icon-button ${name} bluetooth`} {...props}>
             <label
diff --git a/src/components/menus/bluetooth/devices/helpers.ts b/src/components/menus/bluetooth/devices/helpers.ts
index 1e77cb8..0fe6658 100644
--- a/src/components/menus/bluetooth/devices/helpers.ts
+++ b/src/components/menus/bluetooth/devices/helpers.ts
@@ -41,7 +41,9 @@ export const getAvailableBluetoothDevices = (): AstalBluetooth.Device[] => {
  */
 export const getConnectedBluetoothDevices = (): string[] => {
     const availableDevices = getAvailableBluetoothDevices();
-    const connectedDeviceNames = availableDevices.filter((d) => d.connected || d.paired).map((d) => d.address);
+    const connectedDeviceNames = availableDevices
+        .filter((d) => d.connected || d.paired)
+        .map((d) => d.address);
 
     return connectedDeviceNames;
 };
diff --git a/src/components/menus/bluetooth/header/Controls/helper.ts b/src/components/menus/bluetooth/header/Controls/helper.ts
index 7e43cfc..40e3f36 100644
--- a/src/components/menus/bluetooth/header/Controls/helper.ts
+++ b/src/components/menus/bluetooth/header/Controls/helper.ts
@@ -10,7 +10,7 @@ Variable.derive([bind(bluetoothService, 'adapter')], () => {
     discoveringBinding?.drop();
     discoveringBinding = undefined;
 
-    if (!bluetoothService.adapter) {
+    if (bluetoothService.adapter === null) {
         return;
     }
 
diff --git a/src/components/menus/bluetooth/header/index.tsx b/src/components/menus/bluetooth/header/index.tsx
index dc06d56..7e42e07 100644
--- a/src/components/menus/bluetooth/header/index.tsx
+++ b/src/components/menus/bluetooth/header/index.tsx
@@ -3,7 +3,14 @@ import { Controls } from './Controls';
 
 export const Header = (): JSX.Element => {
     const MenuLabel = (): JSX.Element => {
-        return <label className="menu-label" valign={Gtk.Align.CENTER} halign={Gtk.Align.START} label="Bluetooth" />;
+        return (
+            <label
+                className="menu-label"
+                valign={Gtk.Align.CENTER}
+                halign={Gtk.Align.START}
+                label="Bluetooth"
+            />
+        );
     };
 
     return (
diff --git a/src/components/menus/calendar/CalendarWidget.tsx b/src/components/menus/calendar/CalendarWidget.tsx
index 3b7cfd1..aa9a746 100644
--- a/src/components/menus/calendar/CalendarWidget.tsx
+++ b/src/components/menus/calendar/CalendarWidget.tsx
@@ -3,7 +3,12 @@ import Calendar from 'src/components/shared/Calendar';
 
 export const CalendarWidget = (): JSX.Element => {
     return (
-        <box className={'calendar-menu-item-container calendar'} halign={Gtk.Align.FILL} valign={Gtk.Align.FILL} expand>
+        <box
+            className={'calendar-menu-item-container calendar'}
+            halign={Gtk.Align.FILL}
+            valign={Gtk.Align.FILL}
+            expand
+        >
             <box className={'calendar-container-box'}>
                 <Calendar
                     className={'calendar-menu-widget'}
diff --git a/src/components/menus/calendar/time/MilitaryTime.tsx b/src/components/menus/calendar/time/MilitaryTime.tsx
index cacd167..3c5953f 100644
--- a/src/components/menus/calendar/time/MilitaryTime.tsx
+++ b/src/components/menus/calendar/time/MilitaryTime.tsx
@@ -1,7 +1,7 @@
 import options from 'src/options';
 import { bind, Variable } from 'astal';
 import { Gtk } from 'astal/gtk3';
-import { systemTime } from 'src/globals/time';
+import { systemTime } from 'src/shared/time';
 
 const { military, hideSeconds } = options.menus.clock.time;
 
@@ -16,7 +16,7 @@ export const MilitaryTime = (): JSX.Element => {
                 <label
                     className={'clock-content-time'}
                     label={bind(systemTime).as((time) => {
-                        return time?.format(hideSeconds ? '%H:%M' : '%H:%M:%S') || '';
+                        return time?.format(hideSeconds ? '%H:%M' : '%H:%M:%S') ?? '';
                     })}
                 />
             </box>
diff --git a/src/components/menus/calendar/time/StandardTime.tsx b/src/components/menus/calendar/time/StandardTime.tsx
index a4f086a..3434ba5 100644
--- a/src/components/menus/calendar/time/StandardTime.tsx
+++ b/src/components/menus/calendar/time/StandardTime.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
 import { bind, GLib, Variable } from 'astal';
 import { Gtk } from 'astal/gtk3';
-import { systemTime } from 'src/globals/time';
+import { systemTime } from 'src/shared/time';
 
 const { military, hideSeconds } = options.menus.clock.time;
 
-const period = Variable('').poll(1000, (): string => GLib.DateTime.new_now_local().format('%p') || '');
+const period = Variable('').poll(1000, (): string => GLib.DateTime.new_now_local().format('%p') ?? '');
 
 export const StandardTime = (): JSX.Element => {
     const CurrentTime = ({ hideSeconds }: CurrentTimeProps): JSX.Element => {
@@ -14,7 +14,7 @@ export const StandardTime = (): JSX.Element => {
                 <label
                     className={'clock-content-time'}
                     label={bind(systemTime).as((time) => {
-                        return time?.format(hideSeconds ? '%I:%M' : '%I:%M:%S') || '';
+                        return time?.format(hideSeconds ? '%I:%M' : '%I:%M:%S') ?? '';
                     })}
                 />
             </box>
diff --git a/src/components/menus/calendar/time/index.tsx b/src/components/menus/calendar/time/index.tsx
index 5919497..7f4737b 100644
--- a/src/components/menus/calendar/time/index.tsx
+++ b/src/components/menus/calendar/time/index.tsx
@@ -4,8 +4,18 @@ import { StandardTime } from './StandardTime';
 
 export const TimeWidget = (): JSX.Element => {
     return (
-        <box className={'calendar-menu-item-container clock'} valign={Gtk.Align.CENTER} halign={Gtk.Align.FILL} hexpand>
-            <box className={'clock-content-items'} valign={Gtk.Align.CENTER} halign={Gtk.Align.CENTER} hexpand>
+        <box
+            className={'calendar-menu-item-container clock'}
+            valign={Gtk.Align.CENTER}
+            halign={Gtk.Align.FILL}
+            hexpand
+        >
+            <box
+                className={'clock-content-items'}
+                valign={Gtk.Align.CENTER}
+                halign={Gtk.Align.CENTER}
+                hexpand
+            >
                 <StandardTime />
                 <MilitaryTime />
             </box>
diff --git a/src/components/menus/calendar/weather/hourly/helpers.ts b/src/components/menus/calendar/weather/hourly/helpers.ts
index 4f6ae84..bb80500 100644
--- a/src/components/menus/calendar/weather/hourly/helpers.ts
+++ b/src/components/menus/calendar/weather/hourly/helpers.ts
@@ -1,5 +1,5 @@
-import { isValidWeatherIconTitle } from 'src/globals/weather';
-import { Weather, WeatherIconTitle } from 'src/lib/types/weather';
+import { Weather, WeatherIconTitle } from 'src/lib/types/weather.types';
+import { isValidWeatherIconTitle } from 'src/shared/weather';
 
 /**
  * Retrieves the next epoch time for weather data.
diff --git a/src/components/menus/calendar/weather/hourly/icon/index.tsx b/src/components/menus/calendar/weather/hourly/icon/index.tsx
index 673709b..7699681 100644
--- a/src/components/menus/calendar/weather/hourly/icon/index.tsx
+++ b/src/components/menus/calendar/weather/hourly/icon/index.tsx
@@ -1,5 +1,5 @@
 import { bind } from 'astal';
-import { globalWeatherVar } from 'src/globals/weather';
+import { globalWeatherVar } from 'src/shared/weather';
 import { Gtk } from 'astal/gtk3';
 import { weatherIcons } from 'src/lib/icons/weather.js';
 import { getIconQuery } from '../helpers';
diff --git a/src/components/menus/calendar/weather/hourly/temperature/index.tsx b/src/components/menus/calendar/weather/hourly/temperature/index.tsx
index 61ac306..0f056d2 100644
--- a/src/components/menus/calendar/weather/hourly/temperature/index.tsx
+++ b/src/components/menus/calendar/weather/hourly/temperature/index.tsx
@@ -1,5 +1,5 @@
 import options from 'src/options';
-import { globalWeatherVar } from 'src/globals/weather';
+import { globalWeatherVar } from 'src/shared/weather';
 import { getNextEpoch } from '../helpers';
 import { bind, Variable } from 'astal';
 
diff --git a/src/components/menus/calendar/weather/hourly/time/index.tsx b/src/components/menus/calendar/weather/hourly/time/index.tsx
index be755e9..04f5797 100644
--- a/src/components/menus/calendar/weather/hourly/time/index.tsx
+++ b/src/components/menus/calendar/weather/hourly/time/index.tsx
@@ -1,4 +1,4 @@
-import { globalWeatherVar } from 'src/globals/weather';
+import { globalWeatherVar } from 'src/shared/weather';
 import { getNextEpoch } from '../helpers';
 import { bind } from 'astal';
 
diff --git a/src/components/menus/calendar/weather/icon/index.tsx b/src/components/menus/calendar/weather/icon/index.tsx
index 6a4ae34..549d06d 100644
--- a/src/components/menus/calendar/weather/icon/index.tsx
+++ b/src/components/menus/calendar/weather/icon/index.tsx
@@ -1,6 +1,6 @@
 import { bind } from 'astal';
 import { Gtk } from 'astal/gtk3';
-import { getWeatherStatusTextIcon } from 'src/globals/weather.js';
+import { getWeatherStatusTextIcon, globalWeatherVar } from 'src/shared/weather';
 
 export const TodayIcon = (): JSX.Element => {
     return (
@@ -11,7 +11,7 @@ export const TodayIcon = (): JSX.Element => {
         >
             <label
                 className={'calendar-menu-weather today icon txt-icon'}
-                label={bind(globalWeatherVar).as(getWeatherStatusTextIcon)}
+                label={bind(globalWeatherVar).as((weather) => getWeatherStatusTextIcon(weather))}
             />
         </box>
     );
diff --git a/src/components/menus/calendar/weather/stats/index.tsx b/src/components/menus/calendar/weather/stats/index.tsx
index a8aa2d4..39797a1 100644
--- a/src/components/menus/calendar/weather/stats/index.tsx
+++ b/src/components/menus/calendar/weather/stats/index.tsx
@@ -1,6 +1,6 @@
-import { getTemperature, globalWeatherVar } from 'src/globals/weather';
+import { getTemperature, globalWeatherVar } from 'src/shared/weather';
 import options from 'src/options';
-import { getRainChance } from 'src/globals/weather';
+import { getRainChance } from 'src/shared/weather';
 import { Gtk } from 'astal/gtk3';
 import { bind, Variable } from 'astal';
 
diff --git a/src/components/menus/calendar/weather/temperature/index.tsx b/src/components/menus/calendar/weather/temperature/index.tsx
index 96470c6..493968c 100644
--- a/src/components/menus/calendar/weather/temperature/index.tsx
+++ b/src/components/menus/calendar/weather/temperature/index.tsx
@@ -1,6 +1,6 @@
 import options from 'src/options';
-import { globalWeatherVar } from 'src/globals/weather';
-import { getTemperature, getWeatherIcon } from 'src/globals/weather';
+import { globalWeatherVar } from 'src/shared/weather';
+import { getTemperature, getWeatherIcon } from 'src/shared/weather';
 import { Gtk } from 'astal/gtk3';
 import { bind, Variable } from 'astal';
 const { unit } = options.menus.clock.weather;
@@ -35,7 +35,9 @@ const Temperature = (): JSX.Element => {
                     (weather) =>
                         `calendar-menu-weather today temp label icon txt-icon ${getWeatherIcon(Math.ceil(weather.current.temp_f)).color}`,
                 )}
-                label={bind(globalWeatherVar).as((weather) => getWeatherIcon(Math.ceil(weather.current.temp_f)).icon)}
+                label={bind(globalWeatherVar).as(
+                    (weather) => getWeatherIcon(Math.ceil(weather.current.temp_f)).icon,
+                )}
             />
         );
     };
diff --git a/src/components/menus/dashboard/controls/ControlButtons.tsx b/src/components/menus/dashboard/controls/ControlButtons.tsx
index d095ae3..d63dd97 100644
--- a/src/components/menus/dashboard/controls/ControlButtons.tsx
+++ b/src/components/menus/dashboard/controls/ControlButtons.tsx
@@ -18,7 +18,9 @@ const notifdService = AstalNotifd.get_default();
 export const WifiButton = (): JSX.Element => {
     return (
         <button
-            className={bind(isWifiEnabled).as((isEnabled) => `dashboard-button wifi ${!isEnabled ? 'disabled' : ''}`)}
+            className={bind(isWifiEnabled).as(
+                (isEnabled) => `dashboard-button wifi ${!isEnabled ? 'disabled' : ''}`,
+            )}
             onClick={(_, event) => {
                 if (isPrimaryClick(event)) {
                     networkService.wifi?.set_enabled(!networkService.wifi.enabled);
@@ -27,7 +29,10 @@ export const WifiButton = (): JSX.Element => {
             tooltipText={'Toggle Wifi'}
             expand
         >
-            <label className={'txt-icon'} label={bind(isWifiEnabled).as((isEnabled) => (isEnabled ? '󰤨' : '󰤭'))} />
+            <label
+                className={'txt-icon'}
+                label={bind(isWifiEnabled).as((isEnabled) => (isEnabled ? '󰤨' : '󰤭'))}
+            />
         </button>
     );
 };
@@ -68,7 +73,10 @@ export const NotificationsButton = (): JSX.Element => {
             tooltipText={'Toggle Notifications'}
             expand
         >
-            <label className={'txt-icon'} label={bind(notifdService, 'dontDisturb').as((dnd) => (dnd ? '󰂛' : '󰂚'))} />
+            <label
+                className={'txt-icon'}
+                label={bind(notifdService, 'dontDisturb').as((dnd) => (dnd ? '󰂛' : '󰂚'))}
+            />
         </button>
     );
 };
diff --git a/src/components/menus/dashboard/controls/helpers.ts b/src/components/menus/dashboard/controls/helpers.ts
index c6a8280..2ae0000 100644
--- a/src/components/menus/dashboard/controls/helpers.ts
+++ b/src/components/menus/dashboard/controls/helpers.ts
@@ -10,7 +10,7 @@ Variable.derive([bind(networkService, 'wifi')], () => {
     wifiEnabledBinding?.drop();
     wifiEnabledBinding = undefined;
 
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return;
     }
 
diff --git a/src/components/menus/dashboard/controls/index.tsx b/src/components/menus/dashboard/controls/index.tsx
index 05b6ae1..337823c 100644
--- a/src/components/menus/dashboard/controls/index.tsx
+++ b/src/components/menus/dashboard/controls/index.tsx
@@ -1,5 +1,11 @@
 import { Gtk } from 'astal/gtk3';
-import { BluetoothButton, MicrophoneButton, NotificationsButton, PlaybackButton, WifiButton } from './ControlButtons';
+import {
+    BluetoothButton,
+    MicrophoneButton,
+    NotificationsButton,
+    PlaybackButton,
+    WifiButton,
+} from './ControlButtons';
 
 export const Controls = ({ isEnabled }: ControlsProps): JSX.Element => {
     if (!isEnabled) {
@@ -7,7 +13,12 @@ export const Controls = ({ isEnabled }: ControlsProps): JSX.Element => {
     }
 
     return (
-        <box className={'dashboard-card controls-container'} halign={Gtk.Align.FILL} valign={Gtk.Align.FILL} expand>
+        <box
+            className={'dashboard-card controls-container'}
+            halign={Gtk.Align.FILL}
+            valign={Gtk.Align.FILL}
+            expand
+        >
             <WifiButton />
             <BluetoothButton />
             <NotificationsButton />
diff --git a/src/components/menus/dashboard/directories/index.tsx b/src/components/menus/dashboard/directories/index.tsx
index 786f34c..2652e5a 100644
--- a/src/components/menus/dashboard/directories/index.tsx
+++ b/src/components/menus/dashboard/directories/index.tsx
@@ -8,7 +8,12 @@ export const Directories = ({ isEnabled }: DirectoriesProps): JSX.Element => {
     }
 
     return (
-        <box className={'dashboard-card directories-container'} valign={Gtk.Align.FILL} halign={Gtk.Align.FILL} expand>
+        <box
+            className={'dashboard-card directories-container'}
+            valign={Gtk.Align.FILL}
+            halign={Gtk.Align.FILL}
+            expand
+        >
             <LeftSection>
                 <LeftLink1 />
                 <LeftLink2 />
diff --git a/src/components/menus/dashboard/profile/PowerButtons.tsx b/src/components/menus/dashboard/profile/PowerButtons.tsx
index cb18291..d0c4de0 100644
--- a/src/components/menus/dashboard/profile/PowerButtons.tsx
+++ b/src/components/menus/dashboard/profile/PowerButtons.tsx
@@ -1,6 +1,6 @@
-import { PowerOptions } from 'src/lib/types/options';
 import { isPrimaryClick } from 'src/lib/utils';
 import { handleClick } from './helpers';
+import { PowerOptions } from 'src/lib/options/options.types';
 
 const PowerActionButton = (icon: string, tooltip: string, action: PowerOptions): JSX.Element => {
     return (
diff --git a/src/components/menus/dashboard/profile/helpers.ts b/src/components/menus/dashboard/profile/helpers.ts
index d6d2c97..e78b82e 100644
--- a/src/components/menus/dashboard/profile/helpers.ts
+++ b/src/components/menus/dashboard/profile/helpers.ts
@@ -1,7 +1,9 @@
 import { App } from 'astal/gtk3';
 import powermenu from '../../power/helpers/actions.js';
-import { PowerOptions } from 'src/lib/types/options.js';
 import { execAsync } from 'astal';
+import options from 'src/options';
+import { PowerOptions } from 'src/lib/options/options.types.js';
+
 const { confirmation, shutdown, logout, sleep, reboot } = options.menus.dashboard.powermenu;
 
 /**
@@ -22,7 +24,9 @@ export const handleClick = (action: PowerOptions): void => {
     App.get_window('dashboardmenu')?.set_visible(false);
 
     if (!confirmation.get()) {
-        execAsync(actions[action]).catch((err) => console.error(`Failed to execute ${action} command. Error: ${err}`));
+        execAsync(actions[action]).catch((err) =>
+            console.error(`Failed to execute ${action} command. Error: ${err}`),
+        );
     } else {
         powermenu.action(action);
     }
diff --git a/src/components/menus/dashboard/shortcuts/buttons/RecordingButton.tsx b/src/components/menus/dashboard/shortcuts/buttons/RecordingButton.tsx
index b48cc38..5682d57 100644
--- a/src/components/menus/dashboard/shortcuts/buttons/RecordingButton.tsx
+++ b/src/components/menus/dashboard/shortcuts/buttons/RecordingButton.tsx
@@ -15,7 +15,12 @@ const MonitorListDropdown = (): JSX.Element => {
     });
 
     return (
-        <Menu className={'dropdown recording'} halign={Gtk.Align.FILL} onDestroy={() => monitorBinding.drop()} hexpand>
+        <Menu
+            className={'dropdown recording'}
+            halign={Gtk.Align.FILL}
+            onDestroy={() => monitorBinding.drop()}
+            hexpand
+        >
             {bind(monitorList).as((monitors) =>
                 monitors.map((monitor) => {
                     const sanitizedPath = getRecordingPath().replace(/"/g, '\\"');
diff --git a/src/components/menus/dashboard/shortcuts/buttons/ShortcutButtons.tsx b/src/components/menus/dashboard/shortcuts/buttons/ShortcutButtons.tsx
index 5f99b56..9ef7a58 100644
--- a/src/components/menus/dashboard/shortcuts/buttons/ShortcutButtons.tsx
+++ b/src/components/menus/dashboard/shortcuts/buttons/ShortcutButtons.tsx
@@ -1,8 +1,8 @@
 import { Widget } from 'astal/gtk3';
-import { ShortcutVariable } from 'src/lib/types/dashboard';
 import { isPrimaryClick } from 'src/lib/utils';
 import { handleClick, hasCommand } from '../helpers';
 import options from 'src/options';
+import { ShortcutVariable } from 'src/lib/types/dashboard.types';
 
 const { left, right } = options.menus.dashboard.shortcuts;
 
@@ -41,7 +41,7 @@ export const LeftShortcut2 = (): JSX.Element => {
         return <box />;
     }
 
-    return <ShortcutButton shortcut={left.shortcut2} className={`dashboard-button`} />;
+    return <ShortcutButton shortcut={left.shortcut2} className={'dashboard-button'} />;
 };
 
 export const LeftShortcut3 = (): JSX.Element => {
@@ -62,7 +62,7 @@ export const LeftShortcut4 = (): JSX.Element => {
         return <box />;
     }
 
-    return <ShortcutButton shortcut={left.shortcut4} className={`dashboard-button `} />;
+    return <ShortcutButton shortcut={left.shortcut4} className={'dashboard-button '} />;
 };
 
 export const RightShortcut1 = (): JSX.Element => {
@@ -70,7 +70,7 @@ export const RightShortcut1 = (): JSX.Element => {
         return <box />;
     }
 
-    return <ShortcutButton shortcut={right.shortcut1} className={`dashboard-button top-button paired`} />;
+    return <ShortcutButton shortcut={right.shortcut1} className={'dashboard-button top-button paired'} />;
 };
 
 export const RightShortcut3 = (): JSX.Element => {
@@ -78,7 +78,7 @@ export const RightShortcut3 = (): JSX.Element => {
         return <box />;
     }
 
-    return <ShortcutButton shortcut={right.shortcut3} className={`dashboard-button top-button paired`} />;
+    return <ShortcutButton shortcut={right.shortcut3} className={'dashboard-button top-button paired'} />;
 };
 
 interface ShortcutButtonProps extends Widget.ButtonProps {
diff --git a/src/components/menus/dashboard/shortcuts/helpers.ts b/src/components/menus/dashboard/shortcuts/helpers.ts
index d26f713..8124a79 100644
--- a/src/components/menus/dashboard/shortcuts/helpers.ts
+++ b/src/components/menus/dashboard/shortcuts/helpers.ts
@@ -1,7 +1,7 @@
 import { bind, execAsync, timeout, Variable } from 'astal';
 import { App } from 'astal/gtk3';
 import { BashPoller } from 'src/lib/poller/BashPoller';
-import { ShortcutVariable } from 'src/lib/types/dashboard';
+import { ShortcutVariable } from 'src/lib/types/dashboard.types';
 import options from 'src/options';
 
 const { left } = options.menus.dashboard.shortcuts;
diff --git a/src/components/menus/dashboard/shortcuts/sections/Column.tsx b/src/components/menus/dashboard/shortcuts/sections/Column.tsx
index 71864a6..e952f3a 100644
--- a/src/components/menus/dashboard/shortcuts/sections/Column.tsx
+++ b/src/components/menus/dashboard/shortcuts/sections/Column.tsx
@@ -1,7 +1,7 @@
 export const LeftColumn = ({ isVisible, children }: LeftColumnProps): JSX.Element => {
     return (
-        <box className={`card-button-section-container ${isVisible ? 'visible' : ''}`}>
-            {isVisible ? (
+        <box className={`card-button-section-container ${isVisible === true ? 'visible' : ''}`}>
+            {isVisible === true ? (
                 <box vertical hexpand vexpand>
                     {children}
                 </box>
@@ -14,7 +14,7 @@ export const LeftColumn = ({ isVisible, children }: LeftColumnProps): JSX.Elemen
 
 export const RightColumn = ({ children }: RightColumnProps): JSX.Element => {
     return (
-        <box className={`card-button-section-container`}>
+        <box className={'card-button-section-container'}>
             <box vertical hexpand vexpand>
                 {children}
             </box>
diff --git a/src/components/menus/dashboard/shortcuts/sections/Section.tsx b/src/components/menus/dashboard/shortcuts/sections/Section.tsx
index 11489b4..6975cbf 100644
--- a/src/components/menus/dashboard/shortcuts/sections/Section.tsx
+++ b/src/components/menus/dashboard/shortcuts/sections/Section.tsx
@@ -77,7 +77,9 @@ export const RightShortcuts = (): JSX.Element => {
         <box>
             {Variable.derive(rightBindings, () => {
                 return (
-                    <box className={`container utilities dashboard-card ${!leftCardHidden.get() ? 'paired' : ''}`}>
+                    <box
+                        className={`container utilities dashboard-card ${!leftCardHidden.get() ? 'paired' : ''}`}
+                    >
                         <LeftColumn isVisible={true}>
                             <RightShortcut1 />
                             <SettingsButton />
diff --git a/src/components/menus/dashboard/stats/StatBars.tsx b/src/components/menus/dashboard/stats/StatBars.tsx
index e7d21fd..0df9f54 100644
--- a/src/components/menus/dashboard/stats/StatBars.tsx
+++ b/src/components/menus/dashboard/stats/StatBars.tsx
@@ -71,7 +71,9 @@ export const RamStat = (): JSX.Element => {
             icon={''}
             stat={'ram'}
             value={bind(ramService.ram).as((ramUsage) => ramUsage.percentage / 100)}
-            label={bind(ramService.ram).as((ramUsage) => `${renderResourceLabel('used/total', ramUsage, true)}`)}
+            label={bind(ramService.ram).as(
+                (ramUsage) => `${renderResourceLabel('used/total', ramUsage, true)}`,
+            )}
         />
     );
 };
diff --git a/src/components/menus/dashboard/stats/helpers.ts b/src/components/menus/dashboard/stats/helpers.ts
index 15298b0..ee4293e 100644
--- a/src/components/menus/dashboard/stats/helpers.ts
+++ b/src/components/menus/dashboard/stats/helpers.ts
@@ -47,7 +47,12 @@ const monitorInterval = (cpuService: Cpu, ramService: Ram, storageService: Stora
  * @param gpuService The GPU service instance.
  * @param storageService The storage service instance.
  */
-const monitorStatsEnabled = (cpuService: Cpu, ramService: Ram, gpuService: Gpu, storageService: Storage): void => {
+const monitorStatsEnabled = (
+    cpuService: Cpu,
+    ramService: Ram,
+    gpuService: Gpu,
+    storageService: Storage,
+): void => {
     enabled.subscribe(() => {
         if (!enabled.get()) {
             ramService.stopPoller();
@@ -95,7 +100,12 @@ const monitorGpuTrackingEnabled = (gpuService: Gpu): void => {
  * @param gpuService The GPU service instance.
  * @param storageService The storage service instance.
  */
-export const initializePollers = (cpuService: Cpu, ramService: Ram, gpuService: Gpu, storageService: Storage): void => {
+export const initializePollers = (
+    cpuService: Cpu,
+    ramService: Ram,
+    gpuService: Gpu,
+    storageService: Storage,
+): void => {
     ramService.setShouldRound(true);
     storageService.setShouldRound(true);
 
diff --git a/src/components/menus/energy/brightness/Icon.tsx b/src/components/menus/energy/brightness/Icon.tsx
index 7e347f2..1ae33cd 100644
--- a/src/components/menus/energy/brightness/Icon.tsx
+++ b/src/components/menus/energy/brightness/Icon.tsx
@@ -3,6 +3,11 @@ import icons from 'src/lib/icons/icons';
 
 export const BrightnessIcon = (): JSX.Element => {
     return (
-        <icon className={'brightness-slider-icon'} valign={Gtk.Align.CENTER} icon={icons.brightness.screen} vexpand />
+        <icon
+            className={'brightness-slider-icon'}
+            valign={Gtk.Align.CENTER}
+            icon={icons.brightness.screen}
+            vexpand
+        />
     );
 };
diff --git a/src/components/menus/energy/profiles/Profile.tsx b/src/components/menus/energy/profiles/Profile.tsx
index 544065f..51af4f8 100644
--- a/src/components/menus/energy/profiles/Profile.tsx
+++ b/src/components/menus/energy/profiles/Profile.tsx
@@ -2,7 +2,7 @@ import { bind } from 'astal';
 import { Gtk } from 'astal/gtk3';
 import AstalPowerProfiles from 'gi://AstalPowerProfiles?version=0.1';
 import icons from 'src/lib/icons/icons';
-import { ProfileType } from 'src/lib/types/powerprofiles';
+import { ProfileType } from 'src/lib/types/powerprofiles.types';
 import { isPrimaryClick } from 'src/lib/utils';
 
 const powerProfilesService = AstalPowerProfiles.get_default();
@@ -18,7 +18,8 @@ export const PowerProfiles = (): JSX.Element => {
                 return (
                     <button
                         className={bind(powerProfilesService, 'activeProfile').as(
-                            (active) => `power-profile-item ${active === powerProfile.profile ? 'active' : ''}`,
+                            (active) =>
+                                `power-profile-item ${active === powerProfile.profile ? 'active' : ''}`,
                         )}
                         onClick={(_, event) => {
                             if (isPrimaryClick(event)) {
diff --git a/src/components/menus/media/components/MediaContainer.tsx b/src/components/menus/media/components/MediaContainer.tsx
index 336ce73..1dcae51 100644
--- a/src/components/menus/media/components/MediaContainer.tsx
+++ b/src/components/menus/media/components/MediaContainer.tsx
@@ -7,7 +7,13 @@ export const MediaContainer = ({ children }: MediaContainerProps): JSX.Element =
             <box className="menu-items-container media" halign={Gtk.Align.FILL} hexpand>
                 <box className={'menu-section-container'}>
                     <box className={'menu-items-section'} vertical={false}>
-                        <box className={'menu-content'} css={getBackground()} halign={Gtk.Align.FILL} hexpand vertical>
+                        <box
+                            className={'menu-content'}
+                            css={getBackground()}
+                            halign={Gtk.Align.FILL}
+                            hexpand
+                            vertical
+                        >
                             {children}
                         </box>
                     </box>
diff --git a/src/components/menus/media/components/controls/Modes.tsx b/src/components/menus/media/components/controls/Modes.tsx
index 7b99a02..54597f4 100644
--- a/src/components/menus/media/components/controls/Modes.tsx
+++ b/src/components/menus/media/components/controls/Modes.tsx
@@ -4,14 +4,15 @@ import { isPrimaryClick } from 'src/lib/utils';
 import { bind } from 'astal';
 import { isLoopActive, isShuffleActive, loopIconMap, loopTooltipMap } from './helpers';
 import AstalMpris from 'gi://AstalMpris?version=0.1';
-import { activePlayer, loopStatus, shuffleStatus } from 'src/globals/media';
+import { activePlayer, loopStatus, shuffleStatus } from 'src/shared/media';
 
 export type LoopStatus = 'none' | 'track' | 'playlist';
 
 export const Loop = (): JSX.Element => {
     const className = bind(loopStatus).as((status) => {
         const isActive = isLoopActive(status);
-        const loopingAllowed = status !== null && status !== AstalMpris.Loop.UNSUPPORTED ? 'enabled' : 'disabled';
+        const loopingAllowed =
+            status !== null && status !== AstalMpris.Loop.UNSUPPORTED ? 'enabled' : 'disabled';
 
         return `media-indicator-control-button loop ${isActive} ${loopingAllowed}`;
     });
@@ -60,7 +61,8 @@ export const Loop = (): JSX.Element => {
 export const Shuffle = (): JSX.Element => {
     const className = bind(shuffleStatus).as((status) => {
         const isActive = isShuffleActive(status);
-        const shuffleAllowed = status !== null && status !== AstalMpris.Shuffle.UNSUPPORTED ? 'enabled' : 'disabled';
+        const shuffleAllowed =
+            status !== null && status !== AstalMpris.Shuffle.UNSUPPORTED ? 'enabled' : 'disabled';
 
         return `media-indicator-control-button shuffle ${isActive} ${shuffleAllowed}`;
     });
diff --git a/src/components/menus/media/components/controls/PlayPause.tsx b/src/components/menus/media/components/controls/PlayPause.tsx
index 3883259..bc52135 100644
--- a/src/components/menus/media/components/controls/PlayPause.tsx
+++ b/src/components/menus/media/components/controls/PlayPause.tsx
@@ -3,7 +3,7 @@ import { isPrimaryClick } from 'src/lib/utils';
 import { bind } from 'astal';
 import { getPlaybackIcon } from './helpers';
 import AstalMpris from 'gi://AstalMpris?version=0.1';
-import { activePlayer, canPlay, playbackStatus } from 'src/globals/media';
+import { activePlayer, canPlay, playbackStatus } from 'src/shared/media';
 
 export const PlayPause = (): JSX.Element => {
     const className = bind(canPlay).as((canPlay) => {
@@ -31,7 +31,13 @@ export const PlayPause = (): JSX.Element => {
     };
 
     return (
-        <button className={className} halign={Gtk.Align.CENTER} hasTooltip tooltipText={tooltipText} onClick={onClick}>
+        <button
+            className={className}
+            halign={Gtk.Align.CENTER}
+            hasTooltip
+            tooltipText={tooltipText}
+            onClick={onClick}
+        >
             <icon icon={icon} />
         </button>
     );
diff --git a/src/components/menus/media/components/controls/Tracks.tsx b/src/components/menus/media/components/controls/Tracks.tsx
index 72626f1..bd1e8b1 100644
--- a/src/components/menus/media/components/controls/Tracks.tsx
+++ b/src/components/menus/media/components/controls/Tracks.tsx
@@ -2,7 +2,7 @@ import icons from 'src/lib/icons/icons';
 import { Astal, Gtk, Widget } from 'astal/gtk3';
 import { isPrimaryClick } from 'src/lib/utils';
 import { bind } from 'astal';
-import { activePlayer, canGoNext, canGoPrevious } from 'src/globals/media';
+import { activePlayer, canGoNext, canGoPrevious } from 'src/shared/media';
 
 export const NextTrack = (): JSX.Element => {
     const className = bind(canGoNext).as((skippable) => {
diff --git a/src/components/menus/media/components/controls/helpers.ts b/src/components/menus/media/components/controls/helpers.ts
index 60f6879..f81e341 100644
--- a/src/components/menus/media/components/controls/helpers.ts
+++ b/src/components/menus/media/components/controls/helpers.ts
@@ -1,7 +1,7 @@
 import AstalMpris from 'gi://AstalMpris?version=0.1';
-import { activePlayer } from 'src/globals/media';
+import { activePlayer } from 'src/shared/media';
 import icons2 from 'src/lib/icons/icons2';
-import { PlaybackIconMap } from 'src/lib/types/mpris';
+import { PlaybackIconMap } from 'src/lib/types/mpris.types';
 
 const mprisService = AstalMpris.get_default();
 
@@ -123,5 +123,7 @@ export const getPreviousPlayer = (): void => {
         return activePlayer.set(mprisService.get_players()[0]);
     }
 
-    return activePlayer.set(mprisService.get_players()[(currentPlayerIndex - 1 + totalPlayers) % totalPlayers]);
+    return activePlayer.set(
+        mprisService.get_players()[(currentPlayerIndex - 1 + totalPlayers) % totalPlayers],
+    );
 };
diff --git a/src/components/menus/media/components/controls/index.tsx b/src/components/menus/media/components/controls/index.tsx
index 14b1055..c96b2e5 100644
--- a/src/components/menus/media/components/controls/index.tsx
+++ b/src/components/menus/media/components/controls/index.tsx
@@ -1,11 +1,10 @@
-import { BoxWidget } from 'src/lib/types/widget.js';
 import { NextTrack, PreviousTrack } from './Tracks.js';
 import { PlayPause } from './PlayPause.js';
 import { Loop, Shuffle } from './Modes.js';
 import { Gtk } from 'astal/gtk3';
 import { NextPlayer, PreviousPlayer } from './Players.js';
 
-export const MediaControls = (): BoxWidget => {
+export const MediaControls = (): JSX.Element => {
     return (
         <box className={'media-indicator-current-player-controls'} vertical>
             <box className={'media-indicator-current-controls'} halign={Gtk.Align.CENTER}>
diff --git a/src/components/menus/media/components/helpers.ts b/src/components/menus/media/components/helpers.ts
index 40fcf36..49c413b 100644
--- a/src/components/menus/media/components/helpers.ts
+++ b/src/components/menus/media/components/helpers.ts
@@ -1,7 +1,7 @@
 import { Binding } from 'astal';
 import { bind, Variable } from 'astal';
 import AstalMpris from 'gi://AstalMpris?version=0.1';
-import { mediaArtUrl } from 'src/globals/media';
+import { mediaArtUrl } from 'src/shared/media';
 import options from 'src/options';
 
 const mprisService = AstalMpris.get_default();
@@ -56,7 +56,9 @@ export const initializeActivePlayerHook = (): void => {
             .get_players()
             .find((p) => p['playbackStatus'] === AstalMpris.PlaybackStatus.PLAYING);
 
-        const playerStillExists = mprisService.get_players().some((player) => curPlayer.set(player.busName));
+        const playerStillExists = mprisService
+            .get_players()
+            .some((player) => curPlayer.get() === player.busName);
 
         const nextPlayerUp = mprisService
             .get_players()
diff --git a/src/components/menus/media/components/timebar/helpers.ts b/src/components/menus/media/components/timebar/helpers.ts
index f786813..6afea36 100644
--- a/src/components/menus/media/components/timebar/helpers.ts
+++ b/src/components/menus/media/components/timebar/helpers.ts
@@ -13,7 +13,7 @@ export const getTimeStamp = (position: number, totalLength: number): string => {
     if (typeof position === 'number' && position >= 0) {
         return `${getFormattedTime(position)} / ${getFormattedTime(totalLength)}`;
     } else {
-        return `00:00`;
+        return '00:00';
     }
 };
 
diff --git a/src/components/menus/media/components/timebar/index.tsx b/src/components/menus/media/components/timebar/index.tsx
index ac32005..482af11 100644
--- a/src/components/menus/media/components/timebar/index.tsx
+++ b/src/components/menus/media/components/timebar/index.tsx
@@ -1,7 +1,7 @@
 import options from 'src/options';
 import { bind, Variable } from 'astal';
 import { Widget } from 'astal/gtk3';
-import { activePlayer, currentPosition, timeStamp } from 'src/globals/media';
+import { activePlayer, currentPosition, timeStamp } from 'src/shared/media';
 
 const { displayTimeTooltip } = options.menus.media;
 
diff --git a/src/components/menus/media/components/timelabel/index.tsx b/src/components/menus/media/components/timelabel/index.tsx
index 56239a7..73b7730 100644
--- a/src/components/menus/media/components/timelabel/index.tsx
+++ b/src/components/menus/media/components/timelabel/index.tsx
@@ -1,6 +1,6 @@
 import options from 'src/options';
 import { bind } from 'astal';
-import { timeStamp } from 'src/globals/media';
+import { timeStamp } from 'src/shared/media';
 
 const { displayTime } = options.menus.media;
 
diff --git a/src/components/menus/media/components/title/SongAlbum.tsx b/src/components/menus/media/components/title/SongAlbum.tsx
index 6f59e6a..5458613 100644
--- a/src/components/menus/media/components/title/SongAlbum.tsx
+++ b/src/components/menus/media/components/title/SongAlbum.tsx
@@ -1,7 +1,7 @@
 import options from 'src/options';
 import { Gtk } from 'astal/gtk3';
 import { bind } from 'astal';
-import { mediaAlbum } from 'src/globals/media';
+import { mediaAlbum } from 'src/shared/media';
 
 const { hideAlbum } = options.menus.media;
 
diff --git a/src/components/menus/media/components/title/SongAuthor.tsx b/src/components/menus/media/components/title/SongAuthor.tsx
index 8da8899..6bf8f28 100644
--- a/src/components/menus/media/components/title/SongAuthor.tsx
+++ b/src/components/menus/media/components/title/SongAuthor.tsx
@@ -1,7 +1,7 @@
 import options from 'src/options';
 import { Gtk } from 'astal/gtk3';
 import { bind } from 'astal';
-import { mediaArtist } from 'src/globals/media';
+import { mediaArtist } from 'src/shared/media';
 
 const { hideAuthor } = options.menus.media;
 
diff --git a/src/components/menus/media/components/title/SongName.tsx b/src/components/menus/media/components/title/SongName.tsx
index 222ae17..38bdf1c 100644
--- a/src/components/menus/media/components/title/SongName.tsx
+++ b/src/components/menus/media/components/title/SongName.tsx
@@ -1,6 +1,6 @@
 import { Gtk } from 'astal/gtk3';
 import { bind } from 'astal';
-import { mediaTitle } from 'src/globals/media';
+import { mediaTitle } from 'src/shared/media';
 
 export const SongName = (): JSX.Element => {
     return (
diff --git a/src/components/menus/network/ethernet/helpers.ts b/src/components/menus/network/ethernet/helpers.ts
index 4b9f0a2..5e87ca7 100644
--- a/src/components/menus/network/ethernet/helpers.ts
+++ b/src/components/menus/network/ethernet/helpers.ts
@@ -29,7 +29,7 @@ const getWiredState = (): void => {
     wiredStateBinding?.drop();
     wiredStateBinding = undefined;
 
-    if (!networkService.wired) {
+    if (networkService.wired === null) {
         wiredState.set(AstalNetwork.DeviceState.UNAVAILABLE);
         return;
     }
@@ -49,7 +49,7 @@ const getWiredInternet = (): void => {
     wiredInternetBinding?.drop();
     wiredInternetBinding = undefined;
 
-    if (!networkService.wired) {
+    if (networkService.wired === null) {
         return;
     }
 
@@ -68,7 +68,7 @@ const getWiredIcon = (): void => {
     wiredIconBinding?.drop();
     wiredIconBinding = undefined;
 
-    if (!networkService.wired) {
+    if (networkService.wired === null) {
         wiredIcon.set('network-wired-symbolic');
         return;
     }
@@ -88,7 +88,7 @@ const getWiredSpeed = (): void => {
     wiredSpeedBinding?.drop();
     wiredSpeedBinding = undefined;
 
-    if (!networkService.wired) {
+    if (networkService.wired === null) {
         return;
     }
 
diff --git a/src/components/menus/network/utils.ts b/src/components/menus/network/utils.ts
index 050db99..42821f6 100644
--- a/src/components/menus/network/utils.ts
+++ b/src/components/menus/network/utils.ts
@@ -1,4 +1,4 @@
-import { WifiIcon } from 'src/lib/types/network';
+import { WifiIcon } from 'src/lib/types/network.types';
 
 /**
  * Retrieves the appropriate WiFi icon based on the provided icon name.
diff --git a/src/components/menus/network/wifi/APStaging/AccessPoint.tsx b/src/components/menus/network/wifi/APStaging/AccessPoint.tsx
index c5ebf71..8cb7c14 100644
--- a/src/components/menus/network/wifi/APStaging/AccessPoint.tsx
+++ b/src/components/menus/network/wifi/APStaging/AccessPoint.tsx
@@ -5,7 +5,9 @@ import Spinner from 'src/components/shared/Spinner';
 import AstalNetwork from 'gi://AstalNetwork?version=0.1';
 
 export const AccessPoint = ({ staging, connecting }: AccessPointProps): JSX.Element => {
-    const ConnectionIcon = (): JSX.Element => <icon className="network-icon wifi" icon={staging.get()?.iconName} />;
+    const ConnectionIcon = (): JSX.Element => (
+        <icon className="network-icon wifi" icon={staging.get()?.iconName} />
+    );
     const ConnectionSpinner = (): JSX.Element => (
         <revealer
             halign={Gtk.Align.END}
diff --git a/src/components/menus/network/wifi/Controls/helpers.ts b/src/components/menus/network/wifi/Controls/helpers.ts
index aa208d4..7cf69f9 100644
--- a/src/components/menus/network/wifi/Controls/helpers.ts
+++ b/src/components/menus/network/wifi/Controls/helpers.ts
@@ -10,7 +10,7 @@ Variable.derive([bind(networkService, 'wifi')], () => {
     scanningBinding?.drop();
     scanningBinding = undefined;
 
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return;
     }
 
diff --git a/src/components/menus/network/wifi/WirelessAPs/AccessPoint.tsx b/src/components/menus/network/wifi/WirelessAPs/AccessPoint.tsx
index 5d4bb8b..e02be69 100644
--- a/src/components/menus/network/wifi/WirelessAPs/AccessPoint.tsx
+++ b/src/components/menus/network/wifi/WirelessAPs/AccessPoint.tsx
@@ -29,7 +29,11 @@ export const AccessPoint = ({ connecting, accessPoint }: AccessPointProps): JSX.
                     label={accessPoint.ssid ?? ''}
                 />
                 <revealer revealChild={isApActive(accessPoint) && isApEnabled(networkService.wifi?.state)}>
-                    <label className="connection-status dim" halign={Gtk.Align.START} label={getWifiStatus()} />
+                    <label
+                        className="connection-status dim"
+                        halign={Gtk.Align.START}
+                        label={getWifiStatus()}
+                    />
                 </revealer>
             </box>
         );
diff --git a/src/components/menus/network/wifi/WirelessAPs/Controls.tsx b/src/components/menus/network/wifi/WirelessAPs/Controls.tsx
index 4a63dca..8ba65d1 100644
--- a/src/components/menus/network/wifi/WirelessAPs/Controls.tsx
+++ b/src/components/menus/network/wifi/WirelessAPs/Controls.tsx
@@ -12,7 +12,11 @@ export const Controls = ({ connecting, accessPoint }: ControlsProps): JSX.Elemen
                     disconnectFromAP(accessPoint, event);
                 }}
             >
-                <label className="menu-icon-button disconnect-network txt-icon" tooltipText="Disconnect" label="󱘖" />
+                <label
+                    className="menu-icon-button disconnect-network txt-icon"
+                    tooltipText="Disconnect"
+                    label="󱘖"
+                />
             </button>
         );
     };
diff --git a/src/components/menus/network/wifi/WirelessAPs/helpers.ts b/src/components/menus/network/wifi/WirelessAPs/helpers.ts
index 2f3170e..9644f5e 100644
--- a/src/components/menus/network/wifi/WirelessAPs/helpers.ts
+++ b/src/components/menus/network/wifi/WirelessAPs/helpers.ts
@@ -25,7 +25,7 @@ const wifiEnabled = (): void => {
     wifiEnabledBinding?.drop();
     wifiEnabledBinding = undefined;
 
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return;
     }
 
@@ -44,7 +44,7 @@ const accessPoints = (): void => {
     accessPointBinding?.drop();
     accessPointBinding = undefined;
 
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return;
     }
 
@@ -62,7 +62,7 @@ const accessPoints = (): void => {
  * @returns An array of deduplicated access points.
  */
 const dedupeWAPs = (): AstalNetwork.AccessPoint[] => {
-    if (!networkService.wifi) {
+    if (networkService.wifi === null) {
         return [];
     }
 
@@ -136,7 +136,7 @@ export const getFilteredWirelessAPs = (): AstalNetwork.AccessPoint[] => {
  * @returns True if the device is in an active state; otherwise, false.
  */
 export const isApEnabled = (state: AstalNetwork.DeviceState | undefined): boolean => {
-    if (!state) {
+    if (state == null) {
         return false;
     }
 
@@ -206,7 +206,7 @@ export const getIdFromSsid = (ssid: string, nmcliOutput: string): string | undef
 export const getWifiStatus = (): string => {
     const wifiState = networkService.wifi?.state;
 
-    if (wifiState) {
+    if (wifiState !== null) {
         return DEVICE_STATES[wifiState];
     }
     return DEVICE_STATES[AstalNetwork.DeviceState.UNKNOWN];
@@ -232,9 +232,9 @@ export const connectToAP = (accessPoint: AstalNetwork.AccessPoint, event: Astal.
             connecting.set('');
             staging.set({} as AstalNetwork.AccessPoint);
         })
-        .catch((err) => {
+        .catch((err: Error) => {
             connecting.set('');
-            if (err.message?.toLowerCase().includes('secrets were required, but not provided')) {
+            if (err.message.toLowerCase().includes('secrets were required, but not provided')) {
                 staging.set(accessPoint);
             } else {
                 Notify({
diff --git a/src/components/menus/notifications/controls/ClearNotificationsButton.tsx b/src/components/menus/notifications/controls/ClearNotificationsButton.tsx
index b8296cc..94bdfed 100644
--- a/src/components/menus/notifications/controls/ClearNotificationsButton.tsx
+++ b/src/components/menus/notifications/controls/ClearNotificationsButton.tsx
@@ -1,6 +1,6 @@
 import { bind } from 'astal';
 import AstalNotifd from 'gi://AstalNotifd?version=0.1';
-import { clearNotifications } from 'src/globals/notification';
+import { clearNotifications, removingNotifications } from 'src/shared/notification';
 import { isPrimaryClick } from 'src/lib/utils';
 import options from 'src/options';
 
@@ -18,7 +18,7 @@ export const ClearNotificationsButton = (): JSX.Element => {
                     return;
                 }
 
-                if (removingNotifications.get()) {
+                if (removingNotifications.get() === true) {
                     return;
                 }
 
@@ -27,7 +27,7 @@ export const ClearNotificationsButton = (): JSX.Element => {
         >
             <label
                 className={bind(removingNotifications).as((removing) => {
-                    return removing
+                    return removing === true
                         ? 'clear-notifications-label txt-icon removing'
                         : 'clear-notifications-label txt-icon';
                 })}
diff --git a/src/components/menus/notifications/controls/MenuLabel.tsx b/src/components/menus/notifications/controls/MenuLabel.tsx
index 0bb56d9..87656be 100644
--- a/src/components/menus/notifications/controls/MenuLabel.tsx
+++ b/src/components/menus/notifications/controls/MenuLabel.tsx
@@ -2,7 +2,12 @@ import { Gtk } from 'astal/gtk3';
 
 export const MenuLabel = (): JSX.Element => {
     return (
-        <box className={'menu-label-container notifications'} halign={Gtk.Align.START} valign={Gtk.Align.CENTER} expand>
+        <box
+            className={'menu-label-container notifications'}
+            halign={Gtk.Align.START}
+            valign={Gtk.Align.CENTER}
+            expand
+        >
             <label className={'menu-label notifications'} label={'Notifications'} />
         </box>
     );
diff --git a/src/components/menus/notifications/helpers.ts b/src/components/menus/notifications/helpers.ts
index 4086d29..6a88ee3 100644
--- a/src/components/menus/notifications/helpers.ts
+++ b/src/components/menus/notifications/helpers.ts
@@ -1,7 +1,8 @@
 import { bind, Variable } from 'astal';
 import AstalNotifd from 'gi://AstalNotifd?version=0.1';
-const { displayedTotal } = options.notifications;
+import options from 'src/options';
 
+const { displayedTotal } = options.notifications;
 const notifdService = AstalNotifd.get_default();
 
 /**
diff --git a/src/components/menus/notifications/notification/Placeholder.tsx b/src/components/menus/notifications/notification/Placeholder.tsx
index 8bb1a16..755790d 100644
--- a/src/components/menus/notifications/notification/Placeholder.tsx
+++ b/src/components/menus/notifications/notification/Placeholder.tsx
@@ -6,7 +6,12 @@ const notifdService = AstalNotifd.get_default();
 
 export const Placeholder = (): JSX.Element => {
     return (
-        <box className={'notification-label-container'} halign={Gtk.Align.CENTER} valign={Gtk.Align.FILL} expand>
+        <box
+            className={'notification-label-container'}
+            halign={Gtk.Align.CENTER}
+            valign={Gtk.Align.FILL}
+            expand
+        >
             <box valign={Gtk.Align.CENTER} vertical expand>
                 <label
                     className={'placeholder-label dim bell txt-icon'}
diff --git a/src/components/menus/notifications/notification/index.tsx b/src/components/menus/notifications/notification/index.tsx
index 7110a98..e5bbd64 100644
--- a/src/components/menus/notifications/notification/index.tsx
+++ b/src/components/menus/notifications/notification/index.tsx
@@ -13,7 +13,12 @@ const { displayedTotal, ignore, showActionsOnHover } = options.notifications;
 export const NotificationsContainer = ({ curPage }: NotificationsContainerProps): JSX.Element => {
     return (
         <scrollable vscroll={Gtk.PolicyType.AUTOMATIC}>
-            <box className={'menu-content-container notifications'} halign={Gtk.Align.FILL} spacing={0} vexpand>
+            <box
+                className={'menu-content-container notifications'}
+                halign={Gtk.Align.FILL}
+                spacing={0}
+                vexpand
+            >
                 {Variable.derive(
                     [
                         bind(notifdService, 'notifications'),
diff --git a/src/components/menus/notifications/pager/index.tsx b/src/components/menus/notifications/pager/index.tsx
index 1b8d62e..ed71263 100644
--- a/src/components/menus/notifications/pager/index.tsx
+++ b/src/components/menus/notifications/pager/index.tsx
@@ -32,7 +32,11 @@ export const NotificationPager = ({ curPage }: NotificationPagerProps): JSX.Elem
                 <box>
                     <FirstPageButton curPage={curPage} currentPage={currentPage} />
                     <PreviousPageButton curPage={curPage} currentPage={currentPage} />
-                    <PageDisplay notifications={notifications} currentPage={currentPage} dispTotal={dispTotal} />
+                    <PageDisplay
+                        notifications={notifications}
+                        currentPage={currentPage}
+                        dispTotal={dispTotal}
+                    />
                     <NextPageButton
                         curPage={curPage}
                         currentPage={currentPage}
diff --git a/src/components/menus/power/helpers/actions.ts b/src/components/menus/power/helpers/actions.ts
index 8ab97ec..71de829 100644
--- a/src/components/menus/power/helpers/actions.ts
+++ b/src/components/menus/power/helpers/actions.ts
@@ -1,7 +1,7 @@
-import { Action } from 'src/lib/types/power';
 import options from 'src/options';
 import { execAsync, GObject, property, register } from 'astal';
 import { App } from 'astal/gtk3';
+import { Action } from 'src/lib/types/power.types';
 const { sleep, reboot, logout, shutdown } = options.menus.dashboard.powermenu;
 
 @register({ GTypeName: 'PowerMenu' })
@@ -10,16 +10,16 @@ class PowerMenu extends GObject.Object {
     #cmd = '';
 
     @property(String)
-    get title(): string {
+    public get title(): string {
         return this.#title;
     }
 
     @property(String)
-    get cmd(): string {
+    public get cmd(): string {
         return this.#cmd;
     }
 
-    action(action: Action): void {
+    public action(action: Action): void {
         [this.#cmd, this.#title] = {
             sleep: [sleep.get(), 'Sleep'],
             reboot: [reboot.get(), 'Reboot'],
@@ -34,7 +34,7 @@ class PowerMenu extends GObject.Object {
         App.get_window('verification')?.set_visible(true);
     }
 
-    customAction(action: Action, cmnd: string): void {
+    public customAction(action: Action, cmnd: string): void {
         [this.#cmd, this.#title] = [cmnd, action];
 
         this.notify('cmd');
@@ -44,16 +44,15 @@ class PowerMenu extends GObject.Object {
         App.get_window('verification')?.set_visible(true);
     }
 
-    shutdown = (): void => {
+    public shutdown = (): void => {
         this.action('shutdown');
     };
 
-    exec = (): void => {
+    public exec = (): void => {
         App.get_window('verification')?.set_visible(false);
         execAsync(this.#cmd);
     };
 }
 
 const powermenu = new PowerMenu();
-Object.assign(globalThis, { powermenu });
 export default powermenu;
diff --git a/src/components/menus/power/index.tsx b/src/components/menus/power/index.tsx
index a3d6814..c7d5650 100644
--- a/src/components/menus/power/index.tsx
+++ b/src/components/menus/power/index.tsx
@@ -1,4 +1,3 @@
-import { Action } from 'src/lib/types/power.js';
 import PopupWindow from '../shared/popup/index.js';
 import powermenu from './helpers/actions.js';
 import options from 'src/options.js';
@@ -7,6 +6,7 @@ import icons from 'src/lib/icons/icons.js';
 import { bind } from 'astal';
 import { Gtk } from 'astal/gtk3';
 import { RevealerTransitionMap } from 'src/lib/constants/options.js';
+import { Action } from 'src/lib/types/power.types.js';
 
 const { transition } = options.menus;
 
@@ -21,7 +21,11 @@ const SysButton = ({ action, label }: SysButtonProps): JSX.Element => {
             }}
         >
             <box className={'system-button widget-box'} vertical vexpand valign={Gtk.Align.FILL}>
-                <icon className={`system-button_icon txt-icon ${action}`} icon={icons.powermenu[action]} vexpand />
+                <icon
+                    className={`system-button_icon txt-icon ${action}`}
+                    icon={icons.powermenu[action]}
+                    vexpand
+                />
                 <label className={`system-button_label ${action}`} label={label} vexpand />
             </box>
         </button>
@@ -29,7 +33,10 @@ const SysButton = ({ action, label }: SysButtonProps): JSX.Element => {
 };
 
 export default (): JSX.Element => (
-    <PopupWindow name={'powermenu'} transition={bind(transition).as((transition) => RevealerTransitionMap[transition])}>
+    <PopupWindow
+        name={'powermenu'}
+        transition={bind(transition).as((transition) => RevealerTransitionMap[transition])}
+    >
         <box className={'powermenu horizontal'}>
             <SysButton action={'shutdown'} label={'SHUTDOWN'} />
             <SysButton action={'logout'} label={'LOG OUT'} />
diff --git a/src/components/menus/power/verification.tsx b/src/components/menus/power/verification.tsx
index 0a96a59..5edca5d 100644
--- a/src/components/menus/power/verification.tsx
+++ b/src/components/menus/power/verification.tsx
@@ -4,14 +4,16 @@ import { App, Gtk } from 'astal/gtk3';
 import { bind } from 'astal';
 
 export default (): JSX.Element => (
-    <PopupWindow name="verification" transition="crossfade" layout={'center'}>
+    <PopupWindow name="verification" transition={Gtk.RevealerTransitionType.CROSSFADE} layout={'center'}>
         <box className="verification" expand={false}>
             <box className="verification-content" expand vertical>
                 <box className="text-box" vertical>
                     <label className="title" label={bind(powermenu, 'title').as((t) => t.toUpperCase())} />
                     <label
                         className="desc"
-                        label={bind(powermenu, 'title').as((p) => `Are you sure you want to ${p.toLowerCase()}?`)}
+                        label={bind(powermenu, 'title').as(
+                            (p) => `Are you sure you want to ${p.toLowerCase()}?`,
+                        )}
                     />
                 </box>
                 <box className="buttons horizontal" vexpand valign={Gtk.Align.END} homogeneous>
diff --git a/src/components/menus/powerDropdown/button.tsx b/src/components/menus/powerDropdown/button.tsx
index 04fe359..fff46ec 100644
--- a/src/components/menus/powerDropdown/button.tsx
+++ b/src/components/menus/powerDropdown/button.tsx
@@ -1,9 +1,9 @@
-import { PowerOptions } from 'src/lib/types/options';
 import { capitalizeFirstLetter } from 'src/lib/utils';
 import options from 'src/options';
 import powermenu from '../power/helpers/actions';
 import { App, Gtk } from 'astal/gtk3';
 import { bind, execAsync } from 'astal';
+import { PowerOptions } from 'src/lib/options/options.types';
 
 const { confirmation, shutdown, logout, sleep, reboot, showLabel } = options.menus.power;
 
@@ -35,7 +35,9 @@ export const PowerButton = (action: PowerOptions): JSX.Element => {
 
     return (
         <button
-            className={bind(showLabel).as((showLbl) => `power-menu-button ${action} ${!showLbl ? 'no-label' : ''}`)}
+            className={bind(showLabel).as(
+                (showLbl) => `power-menu-button ${action} ${!showLbl ? 'no-label' : ''}`,
+            )}
             onClicked={() => handleClick(action)}
         >
             <box vertical={false}>
diff --git a/src/components/menus/shared/dropdown/helpers.ts b/src/components/menus/shared/dropdown/helpers.ts
index 0b355a3..05cede8 100644
--- a/src/components/menus/shared/dropdown/helpers.ts
+++ b/src/components/menus/shared/dropdown/helpers.ts
@@ -1,6 +1,6 @@
+import { DropdownMenuList } from 'src/lib/options/options.types';
 import { calculateMenuPosition } from './locationHandler';
 import { App, Gtk } from 'astal/gtk3';
-import { DropdownMenuList } from 'src/lib/types/options';
 
 /**
  * Handles the realization of a dropdown menu.
diff --git a/src/components/menus/shared/dropdown/index.tsx b/src/components/menus/shared/dropdown/index.tsx
index 5c037c4..33cd679 100644
--- a/src/components/menus/shared/dropdown/index.tsx
+++ b/src/components/menus/shared/dropdown/index.tsx
@@ -1,11 +1,11 @@
 import options from 'src/options';
-import { DropdownMenuProps } from 'src/lib/types/dropdownmenu';
 import { BarEventMargins } from './eventBoxes/index';
-import { globalEventBoxes } from 'src/globals/dropdown';
+import { globalEventBoxes } from 'src/shared/dropdown';
 import { bind } from 'astal';
 import { App, Astal, Gdk, Gtk } from 'astal/gtk3';
 import { Revealer } from 'astal/gtk3/widget';
-import { locationMap } from 'src/lib/types/defaults/bar';
+import { locationMap } from 'src/lib/types/defaults/bar.types';
+import { DropdownMenuProps } from 'src/lib/types/dropdownmenu.types';
 
 const { location } = options.theme.bar;
 
@@ -66,7 +66,10 @@ export default ({
                         onButtonPressEvent={(_, event) => {
                             const buttonClicked = event.get_button()[1];
 
-                            if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
+                            if (
+                                buttonClicked === Gdk.BUTTON_PRIMARY ||
+                                buttonClicked === Gdk.BUTTON_SECONDARY
+                            ) {
                                 return true;
                             }
                         }}
diff --git a/src/components/menus/shared/dropdown/locationHandler/index.ts b/src/components/menus/shared/dropdown/locationHandler/index.ts
index ac86022..4bd1fda 100644
--- a/src/components/menus/shared/dropdown/locationHandler/index.ts
+++ b/src/components/menus/shared/dropdown/locationHandler/index.ts
@@ -1,5 +1,5 @@
 import options from 'src/options';
-import { globalEventBoxes } from 'src/globals/dropdown';
+import { globalEventBoxes } from 'src/shared/dropdown';
 import { GLib } from 'astal';
 import { EventBox } from 'astal/gtk3/widget';
 import AstalHyprland from 'gi://AstalHyprland?version=0.1';
@@ -46,7 +46,7 @@ function getFocusedHyprlandMonitor(): AstalHyprland.Monitor | undefined {
  * @returns An object containing `adjustedWidth` and `adjustedHeight` after scaling is applied.
  */
 function applyMonitorScaling(width: number, height: number, monitorScaling: number): MonitorScaling {
-    const gdkEnvScale = GLib.getenv('GDK_SCALE') || '1';
+    const gdkEnvScale = GLib.getenv('GDK_SCALE') ?? '1';
     const userScalingPriority = scalingPriority.get();
 
     let adjustedWidth = width;
@@ -101,7 +101,11 @@ function adjustForVerticalTransform(
  * @param anchorX - The X coordinate (in scaled pixels) around which the dropdown should be placed.
  * @returns An object containing `leftMargin` and `rightMargin`, ensuring they do not go below 0.
  */
-function calculateHorizontalMargins(monitorWidth: number, dropdownWidth: number, anchorX: number): HorizontalMargins {
+function calculateHorizontalMargins(
+    monitorWidth: number,
+    dropdownWidth: number,
+    anchorX: number,
+): HorizontalMargins {
     const minimumSpacing = 0;
 
     let rightMarginSpacing = monitorWidth - dropdownWidth / 2;
@@ -130,7 +134,11 @@ function calculateHorizontalMargins(monitorWidth: number, dropdownWidth: number,
  * @param monitorHeight - The scaled (and possibly swapped) monitor height.
  * @param dropdownHeight - The height of the dropdown widget.
  */
-function setVerticalPosition(dropdownEventBox: EventBox, monitorHeight: number, dropdownHeight: number): void {
+function setVerticalPosition(
+    dropdownEventBox: EventBox,
+    monitorHeight: number,
+    dropdownHeight: number,
+): void {
     if (location.get() === 'top') {
         dropdownEventBox.set_margin_top(0);
         dropdownEventBox.set_margin_bottom(monitorHeight);
@@ -151,7 +159,10 @@ function setVerticalPosition(dropdownEventBox: EventBox, monitorHeight: number,
  *
  * @returns A Promise that resolves once the dropdown position is fully calculated and set.
  */
-export const calculateMenuPosition = async (positionCoordinates: number[], windowName: string): Promise<void> => {
+export const calculateMenuPosition = async (
+    positionCoordinates: number[],
+    windowName: string,
+): Promise<void> => {
     try {
         const dropdownEventBox = getDropdownEventBox(windowName);
 
@@ -182,7 +193,11 @@ export const calculateMenuPosition = async (positionCoordinates: number[], windo
         );
 
         const isVertical = transform !== undefined ? transform % 2 !== 0 : false;
-        const { finalWidth, finalHeight } = adjustForVerticalTransform(adjustedWidth, adjustedHeight, isVertical);
+        const { finalWidth, finalHeight } = adjustForVerticalTransform(
+            adjustedWidth,
+            adjustedHeight,
+            isVertical,
+        );
 
         const { leftMargin, rightMargin } = calculateHorizontalMargins(
             finalWidth,
diff --git a/src/components/menus/shared/dropdown/types.ts b/src/components/menus/shared/dropdown/types.ts
index 850a760..42a68f5 100644
--- a/src/components/menus/shared/dropdown/types.ts
+++ b/src/components/menus/shared/dropdown/types.ts
@@ -1,4 +1,4 @@
-import { BarLocation } from 'src/lib/types/options';
+import { BarLocation } from 'src/lib/options/options.types';
 
 export type EventBoxPaddingProps = {
     className: string;
diff --git a/src/components/menus/shared/popup/index.tsx b/src/components/menus/shared/popup/index.tsx
index 55e014a..a70d4b1 100644
--- a/src/components/menus/shared/popup/index.tsx
+++ b/src/components/menus/shared/popup/index.tsx
@@ -1,8 +1,13 @@
 import { App, Astal, Gdk, Gtk } from 'astal/gtk3';
-import { WINDOW_LAYOUTS } from 'src/globals/window';
-import { LayoutFunction, Layouts, PaddingProps, PopupRevealerProps, PopupWindowProps } from 'src/lib/types/popupwindow';
-import { Exclusivity, GtkWidget } from 'src/lib/types/widget';
+import { WINDOW_LAYOUTS } from 'src/shared/window';
 import { EventBox, Revealer } from 'astal/gtk3/widget';
+import {
+    PaddingProps,
+    PopupRevealerProps,
+    LayoutFunction,
+    PopupWindowProps,
+} from 'src/lib/types/popupwindow.types';
+import { Layouts } from 'src/lib/types/widget.types';
 
 export const Padding = ({ name, opts }: PaddingProps): JSX.Element => (
     <eventbox
@@ -32,7 +37,7 @@ const PopupRevealer = ({ name, child, transition }: PopupRevealerProps): JSX.Ele
     </box>
 );
 
-const Layout: LayoutFunction = (name: string, child: GtkWidget, transition: Gtk.RevealerTransitionType) => ({
+const Layout: LayoutFunction = (name, child, transition) => ({
     center: () => (
         <centerbox>
             <Padding name={name} />
@@ -119,10 +124,10 @@ const isValidLayout = (layout: string): layout is Layouts => {
 
 export default ({
     name,
-    child,
+    child = <box />,
     layout = 'center',
-    transition = 'none',
-    exclusivity = 'ignore' as Exclusivity,
+    transition = Gtk.RevealerTransitionType.NONE,
+    exclusivity = Astal.Exclusivity.IGNORE,
     ...props
 }: PopupWindowProps): JSX.Element => {
     const layoutFn = isValidLayout(layout) ? layout : 'center';
@@ -147,7 +152,10 @@ export default ({
             application={App}
             layer={Astal.Layer.TOP}
             anchor={
-                Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM | Astal.WindowAnchor.RIGHT | Astal.WindowAnchor.LEFT
+                Astal.WindowAnchor.TOP |
+                Astal.WindowAnchor.BOTTOM |
+                Astal.WindowAnchor.RIGHT |
+                Astal.WindowAnchor.LEFT
             }
             {...props}
         >
diff --git a/src/components/notifications/Actions.tsx b/src/components/notifications/Actions.tsx
index b494ef2..bd7a24b 100644
--- a/src/components/notifications/Actions.tsx
+++ b/src/components/notifications/Actions.tsx
@@ -14,7 +14,9 @@ const ActionButton = ({ notification, action }: ActionButtonProps): JSX.Element
                 }
 
                 if (action.id.includes('scriptAction:-')) {
-                    execAsync(`${action.id.replace('scriptAction:-', '')}`).catch((err) => console.error(err));
+                    execAsync(`${action.id.replace('scriptAction:-', '')}`).catch((err) =>
+                        console.error(err),
+                    );
                     notification.dismiss();
                 } else {
                     notification.invoke(action.id);
@@ -38,7 +40,10 @@ const ActionButton = ({ notification, action }: ActionButtonProps): JSX.Element
 
 export const Actions = ({ notification, showActions }: ActionProps): JSX.Element => {
     return (
-        <revealer transitionType={Gtk.RevealerTransitionType.SLIDE_DOWN} revealChild={showActions ? false : true}>
+        <revealer
+            transitionType={Gtk.RevealerTransitionType.SLIDE_DOWN}
+            revealChild={showActions ? false : true}
+        >
             <eventbox>
                 <box className={'notification-card-actions'} hexpand valign={Gtk.Align.END}>
                     {notification.get_actions().map((action) => {
diff --git a/src/components/notifications/Header.tsx b/src/components/notifications/Header.tsx
index d915e18..29882c7 100644
--- a/src/components/notifications/Header.tsx
+++ b/src/components/notifications/Header.tsx
@@ -2,7 +2,7 @@ import AstalNotifd from 'gi://AstalNotifd?version=0.1';
 import options from 'src/options.js';
 import { GLib } from 'astal';
 import { Gtk } from 'astal/gtk3';
-import { getNotificationIcon } from 'src/globals/notification.js';
+import { getNotificationIcon } from 'src/shared/notification.js';
 import { notifHasImg } from './helpers';
 
 const { military } = options.menus.clock.time;
@@ -13,7 +13,10 @@ export const NotificationIcon = ({ notification }: HeaderProps): JSX.Element =>
     return (
         <box className={'notification-card-header'} halign={Gtk.Align.START}>
             <box css={'min-width: 2rem; min-height: 2rem; '}>
-                <icon className={'notification-icon'} icon={getNotificationIcon(appName, appIcon, desktopEntry)} />
+                <icon
+                    className={'notification-icon'}
+                    icon={getNotificationIcon(appName, appIcon, desktopEntry)}
+                />
             </box>
         </box>
     );
@@ -39,11 +42,16 @@ export const SummaryLabel = ({ notification }: HeaderProps): JSX.Element => {
 
 export const TimeLabel = ({ notification }: HeaderProps): JSX.Element => {
     const time = (time: number, format = '%I:%M %p'): string => {
-        return GLib.DateTime.new_from_unix_local(time).format(military.get() ? '%H:%M' : format) || '--';
+        return GLib.DateTime.new_from_unix_local(time).format(military.get() ? '%H:%M' : format) ?? '--';
     };
 
     return (
-        <box className={'notification-card-header menu'} halign={Gtk.Align.END} valign={Gtk.Align.START} hexpand>
+        <box
+            className={'notification-card-header menu'}
+            halign={Gtk.Align.END}
+            valign={Gtk.Align.START}
+            hexpand
+        >
             <label className={'notification-time'} label={time(notification.time)} vexpand />
         </box>
     );
diff --git a/src/components/notifications/Notification.tsx b/src/components/notifications/Notification.tsx
index 2dca112..565bb14 100644
--- a/src/components/notifications/Notification.tsx
+++ b/src/components/notifications/Notification.tsx
@@ -10,7 +10,11 @@ import { notifHasImg } from './helpers';
 
 const NotificationContent = ({ actionBox, notification }: NotificationContentProps): JSX.Element => {
     return (
-        <box className={`notification-card-content ${!notifHasImg(notification) ? 'noimg' : ''}`} hexpand vertical>
+        <box
+            className={`notification-card-content ${!notifHasImg(notification) ? 'noimg' : ''}`}
+            hexpand
+            vertical
+        >
             <Header notification={notification} />
             <Body notification={notification} />
             {actionBox}
@@ -18,7 +22,11 @@ const NotificationContent = ({ actionBox, notification }: NotificationContentPro
     );
 };
 
-export const NotificationCard = ({ notification, showActions, ...props }: NotificationCardProps): JSX.Element => {
+export const NotificationCard = ({
+    notification,
+    showActions,
+    ...props
+}: NotificationCardProps): JSX.Element => {
     const actionBox: IActionBox | null = notification.get_actions().length ? (
         <Actions notification={notification} showActions={showActions} />
     ) : null;
diff --git a/src/components/notifications/helpers.ts b/src/components/notifications/helpers.ts
index d2aa0ea..0fda0c8 100644
--- a/src/components/notifications/helpers.ts
+++ b/src/components/notifications/helpers.ts
@@ -84,7 +84,9 @@ const dropNotificationPopup = (
     popupNotifications: Variable<AstalNotifd.Notification[]>,
 ): void => {
     const currentPopups = popupNotifications.get();
-    const undismissedNotifications = currentPopups.filter((popupNotif) => popupNotif.id !== notificationToDismiss.id);
+    const undismissedNotifications = currentPopups.filter(
+        (popupNotif) => popupNotif.id !== notificationToDismiss.id,
+    );
 
     popupNotifications.set(undismissedNotifications);
 };
diff --git a/src/components/osd/OsdRevealer.tsx b/src/components/osd/OsdRevealer.tsx
index 09a391c..cb04197 100644
--- a/src/components/osd/OsdRevealer.tsx
+++ b/src/components/osd/OsdRevealer.tsx
@@ -5,7 +5,7 @@ import { OSDIcon } from './icon/index';
 import { revealerSetup } from './helpers';
 import { Gtk } from 'astal/gtk3';
 import { bind } from 'astal';
-import { OSDOrientation } from 'src/lib/types/options';
+import { OSDOrientation } from 'src/lib/options/options.types';
 
 const { orientation } = options.theme.osd;
 
@@ -29,7 +29,11 @@ export const OsdRevealer = (): JSX.Element => {
     const osdOrientation = bind(orientation).as((currentOrientation) => currentOrientation === 'vertical');
 
     return (
-        <revealer transitionType={Gtk.RevealerTransitionType.CROSSFADE} revealChild={false} setup={revealerSetup}>
+        <revealer
+            transitionType={Gtk.RevealerTransitionType.CROSSFADE}
+            revealChild={false}
+            setup={revealerSetup}
+        >
             <box className={'osd-container'} vertical={osdOrientation}>
                 {bind(orientation).as((currentOrientation) => {
                     if (currentOrientation === 'vertical') {
diff --git a/src/components/osd/bar/helpers.ts b/src/components/osd/bar/helpers.ts
index 82aa3f1..f23b93b 100644
--- a/src/components/osd/bar/helpers.ts
+++ b/src/components/osd/bar/helpers.ts
@@ -2,6 +2,7 @@ import { bind, Variable } from 'astal';
 import AstalWp from 'gi://AstalWp?version=0.1';
 import LevelBar from 'src/components/shared/LevelBar';
 import Brightness from 'src/services/Brightness';
+import options from 'src/options';
 
 const wireplumber = AstalWp.get_default() as AstalWp.Wp;
 const audioService = wireplumber.audio;
diff --git a/src/components/osd/bar/index.tsx b/src/components/osd/bar/index.tsx
index 765d6b4..0003bf0 100644
--- a/src/components/osd/bar/index.tsx
+++ b/src/components/osd/bar/index.tsx
@@ -1,7 +1,7 @@
 import { Gtk } from 'astal/gtk3';
 import LevelBar from 'src/components/shared/LevelBar';
-import { OSDOrientation } from 'src/lib/types/options';
 import { setupOsdBar } from './helpers';
+import { OSDOrientation } from 'src/lib/options/options.types';
 
 export const OSDBar = ({ orientation }: OSDBarProps): JSX.Element => {
     const barOrientation = orientation === 'vertical' ? Gtk.Orientation.VERTICAL : Gtk.Orientation.HORIZONTAL;
diff --git a/src/components/osd/helpers.ts b/src/components/osd/helpers.ts
index 77d88b8..3c04c54 100644
--- a/src/components/osd/helpers.ts
+++ b/src/components/osd/helpers.ts
@@ -105,7 +105,10 @@ export const revealerSetup = (self: Widget.Revealer): void => {
         },
     );
 
-    Variable.derive([bind(audioService.defaultSpeaker, 'volume'), bind(audioService.defaultSpeaker, 'mute')], () => {
-        handleReveal(self);
-    });
+    Variable.derive(
+        [bind(audioService.defaultSpeaker, 'volume'), bind(audioService.defaultSpeaker, 'mute')],
+        () => {
+            handleReveal(self);
+        },
+    );
 };
diff --git a/src/components/osd/label/helpers.ts b/src/components/osd/label/helpers.ts
index 563c89c..91c8e80 100644
--- a/src/components/osd/label/helpers.ts
+++ b/src/components/osd/label/helpers.ts
@@ -2,6 +2,7 @@ import { bind, Variable } from 'astal';
 import { Widget } from 'astal/gtk3';
 import AstalWp from 'gi://AstalWp?version=0.1';
 import Brightness from 'src/services/Brightness';
+import options from 'src/options';
 
 const wireplumber = AstalWp.get_default() as AstalWp.Wp;
 const audioService = wireplumber.audio;
diff --git a/src/components/settings/Header.tsx b/src/components/settings/Header.tsx
index 4b3f03a..c7bdb52 100644
--- a/src/components/settings/Header.tsx
+++ b/src/components/settings/Header.tsx
@@ -1,6 +1,7 @@
 import { App, Gtk } from 'astal/gtk3';
 import icons from 'src/lib/icons/icons';
 import { isPrimaryClick } from 'src/lib/utils';
+import options from 'src/options';
 
 export const Header = (): JSX.Element => {
     return (
diff --git a/src/components/settings/pages/config/bar/index.tsx b/src/components/settings/pages/config/bar/index.tsx
index 145390e..c45f113 100644
--- a/src/components/settings/pages/config/bar/index.tsx
+++ b/src/components/settings/pages/config/bar/index.tsx
@@ -23,7 +23,12 @@ export const BarSettings = (): JSX.Element => {
                     className="bar-layout-input"
                 />
                 <Option opt={options.theme.bar.floating} title="Floating Bar" type="boolean" />
-                <Option opt={options.theme.bar.location} title="Location" type="enum" enums={['top', 'bottom']} />
+                <Option
+                    opt={options.theme.bar.location}
+                    title="Location"
+                    type="enum"
+                    enums={['top', 'bottom']}
+                />
 
                 <Option
                     opt={options.bar.autoHide}
@@ -90,8 +95,16 @@ export const BarSettings = (): JSX.Element => {
                     subtitle="Spacing between the buttons in the bar."
                     type="string"
                 />
-                <Option opt={options.theme.bar.buttons.padding_x} title="Button Horizontal Padding" type="string" />
-                <Option opt={options.theme.bar.buttons.padding_y} title="Button Vertical Padding" type="string" />
+                <Option
+                    opt={options.theme.bar.buttons.padding_x}
+                    title="Button Horizontal Padding"
+                    type="string"
+                />
+                <Option
+                    opt={options.theme.bar.buttons.padding_y}
+                    title="Button Vertical Padding"
+                    type="string"
+                />
                 <Option opt={options.theme.bar.buttons.radius} title="Button Radius" type="string" />
                 <Option
                     opt={options.theme.bar.buttons.innerRadiusMultiplier}
@@ -149,7 +162,11 @@ export const BarSettings = (): JSX.Element => {
                 <Header title="Dashboard" />
                 <Option opt={options.bar.launcher.icon} title="Dashboard Menu Icon" type="string" />
                 <Option opt={options.bar.launcher.autoDetectIcon} title="Auto Detect Icon" type="boolean" />
-                <Option opt={options.theme.bar.buttons.dashboard.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.dashboard.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.launcher.rightClick} title="Right Click" type="string" />
                 <Option opt={options.bar.launcher.middleClick} title="Middle Click" type="string" />
                 <Option opt={options.bar.launcher.scrollUp} title="Scroll Up" type="string" />
@@ -157,7 +174,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Workspaces Section */}
                 <Header title="Workspaces" />
-                <Option opt={options.theme.bar.buttons.workspaces.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.workspaces.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option
                     opt={options.bar.workspaces.monitorSpecific}
                     title="Monitor Specific"
@@ -165,7 +186,11 @@ export const BarSettings = (): JSX.Element => {
                     type="boolean"
                 />
                 <Option opt={options.bar.workspaces.show_icons} title="Show Workspace Icons" type="boolean" />
-                <Option opt={options.bar.workspaces.show_numbered} title="Show Workspace Numbers" type="boolean" />
+                <Option
+                    opt={options.bar.workspaces.show_numbered}
+                    title="Show Workspace Numbers"
+                    type="boolean"
+                />
                 <Option
                     opt={options.bar.workspaces.workspaceMask}
                     title="Zero-Based Workspace Numbers"
@@ -259,9 +284,17 @@ export const BarSettings = (): JSX.Element => {
                     subtitle="Only applicable to numbered workspaces and mapped icons. Adjust carefully."
                     type="string"
                 />
-                <Option opt={options.bar.workspaces.icons.available} title="Workspace Available" type="string" />
+                <Option
+                    opt={options.bar.workspaces.icons.available}
+                    title="Workspace Available"
+                    type="string"
+                />
                 <Option opt={options.bar.workspaces.icons.active} title="Workspace Active" type="string" />
-                <Option opt={options.bar.workspaces.icons.occupied} title="Workspace Occupied" type="string" />
+                <Option
+                    opt={options.bar.workspaces.icons.occupied}
+                    title="Workspace Occupied"
+                    type="string"
+                />
                 <Option
                     opt={options.bar.workspaces.applicationIconMap}
                     title="App Icon Mappings"
@@ -313,7 +346,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Window Titles Section */}
                 <Header title="Window Titles" />
-                <Option opt={options.theme.bar.buttons.windowtitle.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.windowtitle.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.windowtitle.custom_title} title="Use Custom Title" type="boolean" />
                 <Option
                     opt={options.bar.windowtitle.title_map}
@@ -339,7 +376,12 @@ export const BarSettings = (): JSX.Element => {
                     subtitle="Truncates the window title to a specified size."
                     type="boolean"
                 />
-                <Option opt={options.bar.windowtitle.truncation_size} title="Truncation Size" type="number" min={10} />
+                <Option
+                    opt={options.bar.windowtitle.truncation_size}
+                    title="Truncation Size"
+                    type="number"
+                    min={10}
+                />
                 <Option
                     opt={options.theme.bar.buttons.windowtitle.spacing}
                     title="Inner Spacing"
@@ -354,7 +396,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Volume Section */}
                 <Header title="Volume" />
-                <Option opt={options.theme.bar.buttons.volume.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.volume.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.volume.label} title="Show Volume Percentage" type="boolean" />
                 <Option
                     opt={options.theme.bar.buttons.volume.spacing}
@@ -369,9 +415,17 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Network Section */}
                 <Header title="Network" />
-                <Option opt={options.theme.bar.buttons.network.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.network.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.network.label} title="Show Network Name" type="boolean" />
-                <Option opt={options.bar.network.showWifiInfo} title="Show Wifi Info On Hover" type="boolean" />
+                <Option
+                    opt={options.bar.network.showWifiInfo}
+                    title="Show Wifi Info On Hover"
+                    type="boolean"
+                />
                 <Option
                     opt={options.bar.network.truncation}
                     title="Truncate Network Name"
@@ -392,7 +446,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Bluetooth Section */}
                 <Header title="Bluetooth" />
-                <Option opt={options.theme.bar.buttons.bluetooth.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.bluetooth.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.bluetooth.label} title="Show Bluetooth Label" type="boolean" />
                 <Option
                     opt={options.theme.bar.buttons.bluetooth.spacing}
@@ -407,7 +465,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Battery Section */}
                 <Header title="Battery" />
-                <Option opt={options.theme.bar.buttons.battery.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.battery.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.battery.label} title="Show Battery Percentage" type="boolean" />
                 <Option
                     opt={options.bar.battery.hideLabelWhenFull}
@@ -427,11 +489,18 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* System Tray Section */}
                 <Header title="System Tray" />
-                <Option opt={options.theme.bar.buttons.systray.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.systray.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option
                     opt={options.bar.systray.ignore}
                     title="Ignore List"
-                    subtitle={'Apps to ignore\n' + 'Wiki: https://hyprpanel.com/configuration/panel.html#system-tray'}
+                    subtitle={
+                        'Apps to ignore\n' +
+                        'Wiki: https://hyprpanel.com/configuration/panel.html#system-tray'
+                    }
                     subtitleLink="https://hyprpanel.com/configuration/panel.html#system-tray"
                     type="object"
                 />
@@ -448,7 +517,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Clock Section */}
                 <Header title="Clock" />
-                <Option opt={options.theme.bar.buttons.clock.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.clock.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option opt={options.bar.clock.format} title="Clock Format" type="string" />
                 <Option opt={options.bar.clock.icon} title="Icon" type="string" />
                 <Option opt={options.bar.clock.showIcon} title="Show Icon" type="boolean" />
@@ -466,7 +539,11 @@ export const BarSettings = (): JSX.Element => {
 
                 {/* Media Section */}
                 <Header title="Media" />
-                <Option opt={options.theme.bar.buttons.media.enableBorder} title="Button Border" type="boolean" />
+                <Option
+                    opt={options.theme.bar.buttons.media.enableBorder}
+                    title="Button Border"
+                    type="boolean"
+                />
                 <Option
                     opt={options.theme.bar.buttons.media.spacing}
                     title="Inner Spacing"
diff --git a/src/components/settings/pages/config/general/index.tsx b/src/components/settings/pages/config/general/index.tsx
index 9eb96c2..d14e11c 100644
--- a/src/components/settings/pages/config/general/index.tsx
+++ b/src/components/settings/pages/config/general/index.tsx
@@ -5,7 +5,11 @@ import { Gtk } from 'astal/gtk3';
 
 export const BarGeneral = (): JSX.Element => {
     return (
-        <scrollable name={'General'} className="bar-theme-page paged-container" vscroll={Gtk.PolicyType.AUTOMATIC}>
+        <scrollable
+            name={'General'}
+            className="bar-theme-page paged-container"
+            vscroll={Gtk.PolicyType.AUTOMATIC}
+        >
             <box vertical>
                 <Header title="General Settings" />
                 <Option
@@ -44,7 +48,12 @@ export const BarGeneral = (): JSX.Element => {
                     subtitle="Command executed when restarting. Use '-b busName' flag if needed."
                     type="string"
                 />
-                <Option opt={options.terminal} title="Terminal" subtitle="For tools like 'btop'" type="string" />
+                <Option
+                    opt={options.terminal}
+                    title="Terminal"
+                    subtitle="For tools like 'btop'"
+                    type="string"
+                />
                 <Option
                     opt={options.tear}
                     title="Tearing Compatible"
@@ -86,7 +95,14 @@ export const BarGeneral = (): JSX.Element => {
                     type="enum"
                     enums={['both', 'gdk', 'hyprland']}
                 />
-                <Option opt={options.theme.bar.scaling} title="Bar" type="number" min={1} max={100} increment={5} />
+                <Option
+                    opt={options.theme.bar.scaling}
+                    title="Bar"
+                    type="number"
+                    min={1}
+                    max={100}
+                    increment={5}
+                />
                 <Option
                     opt={options.theme.notification.scaling}
                     title="Notifications"
@@ -95,7 +111,14 @@ export const BarGeneral = (): JSX.Element => {
                     max={100}
                     increment={5}
                 />
-                <Option opt={options.theme.osd.scaling} title="OSD" type="number" min={1} max={100} increment={5} />
+                <Option
+                    opt={options.theme.osd.scaling}
+                    title="OSD"
+                    type="number"
+                    min={1}
+                    max={100}
+                    increment={5}
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.scaling}
                     title="Dashboard Menu"
diff --git a/src/components/settings/pages/config/menus/dashboard.tsx b/src/components/settings/pages/config/menus/dashboard.tsx
index 39ef364..a9b94ec 100644
--- a/src/components/settings/pages/config/menus/dashboard.tsx
+++ b/src/components/settings/pages/config/menus/dashboard.tsx
@@ -43,7 +43,11 @@ export const DashboardMenuSettings = (): JSX.Element => {
                     title="Show Confirmation Dialogue"
                     type="boolean"
                 />
-                <Option opt={options.menus.dashboard.powermenu.shutdown} title="Shutdown Command" type="string" />
+                <Option
+                    opt={options.menus.dashboard.powermenu.shutdown}
+                    title="Shutdown Command"
+                    type="string"
+                />
                 <Option opt={options.menus.dashboard.powermenu.reboot} title="Reboot Command" type="string" />
                 <Option opt={options.menus.dashboard.powermenu.logout} title="Logout Command" type="string" />
                 <Option opt={options.menus.dashboard.powermenu.sleep} title="Sleep Command" type="string" />
diff --git a/src/components/settings/pages/config/notifications/index.tsx b/src/components/settings/pages/config/notifications/index.tsx
index e5f1887..bec15cc 100644
--- a/src/components/settings/pages/config/notifications/index.tsx
+++ b/src/components/settings/pages/config/notifications/index.tsx
@@ -19,7 +19,16 @@ export const NotificationSettings = (): JSX.Element => {
                     opt={options.notifications.position}
                     title="Notification Location"
                     type="enum"
-                    enums={['top left', 'top', 'top right', 'right', 'bottom right', 'bottom', 'bottom left', 'left']}
+                    enums={[
+                        'top left',
+                        'top',
+                        'top right',
+                        'right',
+                        'bottom right',
+                        'bottom',
+                        'bottom left',
+                        'left',
+                    ]}
                 />
                 <Option opt={options.theme.notification.border_radius} title="Border Radius" type="string" />
                 <Option opt={options.theme.notification.enableShadow} title="Enable Shadow" type="boolean" />
diff --git a/src/components/settings/pages/config/osd/index.tsx b/src/components/settings/pages/config/osd/index.tsx
index 740ef70..269e753 100644
--- a/src/components/settings/pages/config/osd/index.tsx
+++ b/src/components/settings/pages/config/osd/index.tsx
@@ -28,7 +28,16 @@ export const OSDSettings = (): JSX.Element => {
                     title="Position"
                     subtitle="Position of OSD"
                     type="enum"
-                    enums={['top left', 'top', 'top right', 'right', 'bottom right', 'bottom', 'bottom left', 'left']}
+                    enums={[
+                        'top left',
+                        'top',
+                        'top right',
+                        'right',
+                        'bottom right',
+                        'bottom',
+                        'bottom left',
+                        'left',
+                    ]}
                 />
                 <Option
                     opt={options.theme.osd.monitor}
@@ -57,7 +66,12 @@ export const OSDSettings = (): JSX.Element => {
                     type="string"
                 />
                 <Option opt={options.theme.osd.border.size} title="Border Size" type="string" />
-                <Option opt={options.theme.osd.radius} title="Radius" subtitle="Radius of the OSD" type="string" />
+                <Option
+                    opt={options.theme.osd.radius}
+                    title="Radius"
+                    subtitle="Radius of the OSD"
+                    type="string"
+                />
                 <Option
                     opt={options.theme.osd.muted_zero}
                     title="Mute Volume as Zero"
diff --git a/src/components/settings/pages/theme/bar/index.tsx b/src/components/settings/pages/theme/bar/index.tsx
index 9487e7f..9c02e5b 100644
--- a/src/components/settings/pages/theme/bar/index.tsx
+++ b/src/components/settings/pages/theme/bar/index.tsx
@@ -83,14 +83,26 @@ export const BarTheme = (): JSX.Element => {
 
                 {/* Dashboard Button Section */}
                 <Header title="Dashboard Button" />
-                <Option opt={options.theme.bar.buttons.dashboard.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.dashboard.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.buttons.dashboard.icon} title="Icon" type="color" />
                 <Option opt={options.theme.bar.buttons.dashboard.border} title="Border" type="color" />
 
                 {/* Workspaces Section */}
                 <Header title="Workspaces" />
-                <Option opt={options.theme.bar.buttons.workspaces.background} title="Background" type="color" />
-                <Option opt={options.theme.bar.buttons.workspaces.hover} title="Workspace Hover Color" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.workspaces.background}
+                    title="Background"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.buttons.workspaces.hover}
+                    title="Workspace Hover Color"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.buttons.workspaces.available}
                     title="Workspace Available Color"
@@ -101,7 +113,11 @@ export const BarTheme = (): JSX.Element => {
                     title="Workspace Occupied Color"
                     type="color"
                 />
-                <Option opt={options.theme.bar.buttons.workspaces.active} title="Workspace Active Color" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.workspaces.active}
+                    title="Workspace Active Color"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.buttons.workspaces.numbered_active_highlighted_text_color}
                     title="Highlighted Workspace Text Color"
@@ -116,7 +132,11 @@ export const BarTheme = (): JSX.Element => {
 
                 {/* Window Title Section */}
                 <Header title="Window Title" />
-                <Option opt={options.theme.bar.buttons.windowtitle.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.windowtitle.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.buttons.windowtitle.text} title="Text" type="color" />
                 <Option opt={options.theme.bar.buttons.windowtitle.icon} title="Icon" type="color" />
                 <Option
@@ -180,7 +200,11 @@ export const BarTheme = (): JSX.Element => {
 
                 {/* Bluetooth Section */}
                 <Header title="Bluetooth" />
-                <Option opt={options.theme.bar.buttons.bluetooth.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.bluetooth.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.buttons.bluetooth.text} title="Text" type="color" />
                 <Option opt={options.theme.bar.buttons.bluetooth.icon} title="Icon" type="color" />
                 <Option
@@ -197,7 +221,11 @@ export const BarTheme = (): JSX.Element => {
                 {/* System Tray Section */}
                 <Header title="System Tray" />
                 <Option opt={options.theme.bar.buttons.systray.border} title="Border" type="color" />
-                <Option opt={options.theme.bar.buttons.systray.customIcon} title="Custom Icons" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.systray.customIcon}
+                    title="Custom Icons"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.buttons.systray.background} title="Background" type="color" />
 
                 {/* Battery Section */}
@@ -234,8 +262,16 @@ export const BarTheme = (): JSX.Element => {
 
                 {/* Notifications Section */}
                 <Header title="Notifications" />
-                <Option opt={options.theme.bar.buttons.notifications.background} title="Background" type="color" />
-                <Option opt={options.theme.bar.buttons.notifications.total} title="Notification Count" type="color" />
+                <Option
+                    opt={options.theme.bar.buttons.notifications.background}
+                    title="Background"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.buttons.notifications.total}
+                    title="Notification Count"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.buttons.notifications.icon} title="Icon" type="color" />
                 <Option
                     opt={options.theme.bar.buttons.notifications.icon_background}
diff --git a/src/components/settings/pages/theme/menus/battery.tsx b/src/components/settings/pages/theme/menus/battery.tsx
index df1262b..b12bf62 100644
--- a/src/components/settings/pages/theme/menus/battery.tsx
+++ b/src/components/settings/pages/theme/menus/battery.tsx
@@ -24,7 +24,11 @@ export const BatteryMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.battery.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -36,18 +40,38 @@ export const BatteryMenuTheme = (): JSX.Element => {
 
                 {/* List Items Section */}
                 <Header title="List Items" />
-                <Option opt={options.theme.bar.menus.menu.battery.listitems.active} title="Active/Hover" type="color" />
-                <Option opt={options.theme.bar.menus.menu.battery.listitems.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.listitems.active}
+                    title="Active/Hover"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.listitems.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Icons Section */}
                 <Header title="Icons" />
                 <Option opt={options.theme.bar.menus.menu.battery.icons.active} title="Active" type="color" />
-                <Option opt={options.theme.bar.menus.menu.battery.icons.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.icons.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Slider Section */}
                 <Header title="Slider" />
-                <Option opt={options.theme.bar.menus.menu.battery.slider.primary} title="Primary" type="color" />
-                <Option opt={options.theme.bar.menus.menu.battery.slider.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.slider.primary}
+                    title="Primary"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.battery.slider.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.battery.slider.backgroundhover}
                     title="Background (Hover)"
diff --git a/src/components/settings/pages/theme/menus/bluetooth.tsx b/src/components/settings/pages/theme/menus/bluetooth.tsx
index 2065de3..4f04fb3 100644
--- a/src/components/settings/pages/theme/menus/bluetooth.tsx
+++ b/src/components/settings/pages/theme/menus/bluetooth.tsx
@@ -24,11 +24,19 @@ export const BluetoothMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.border.color} title="Border" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.border.color}
+                    title="Border"
+                    type="color"
+                />
 
                 {/* Label Section */}
                 <Header title="Label" />
@@ -36,7 +44,11 @@ export const BluetoothMenuTheme = (): JSX.Element => {
 
                 {/* Status Section */}
                 <Header title="Status" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.status} title="Connection Status" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.status}
+                    title="Connection Status"
+                    type="color"
+                />
 
                 {/* List Items Section */}
                 <Header title="List Items" />
@@ -45,26 +57,58 @@ export const BluetoothMenuTheme = (): JSX.Element => {
                     title="Active/Hover"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.listitems.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.listitems.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Icons Section */}
                 <Header title="Icons" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.icons.active} title="Active" type="color" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.icons.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.icons.active}
+                    title="Active"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.icons.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Icon Buttons Section */}
                 <Header title="Icon Buttons" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.iconbutton.active} title="Active" type="color" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.iconbutton.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.iconbutton.active}
+                    title="Active"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.iconbutton.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Scroller Section */}
                 <Header title="Scroller" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.scroller.color} title="Color" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.scroller.color}
+                    title="Color"
+                    type="color"
+                />
 
                 {/* Switch Section */}
                 <Header title="Switch" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.switch.enabled} title="Enabled" type="color" />
-                <Option opt={options.theme.bar.menus.menu.bluetooth.switch.disabled} title="Disabled" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.switch.enabled}
+                    title="Enabled"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.bluetooth.switch.disabled}
+                    title="Disabled"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.menu.bluetooth.switch.puck} title="Puck" type="color" />
 
                 {/* Switch Divider Section */}
diff --git a/src/components/settings/pages/theme/menus/clock.tsx b/src/components/settings/pages/theme/menus/clock.tsx
index 91c1949..46625c4 100644
--- a/src/components/settings/pages/theme/menus/clock.tsx
+++ b/src/components/settings/pages/theme/menus/clock.tsx
@@ -24,7 +24,11 @@ export const ClockMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.clock.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -42,14 +46,26 @@ export const ClockMenuTheme = (): JSX.Element => {
 
                 {/* Calendar Section */}
                 <Header title="Calendar" />
-                <Option opt={options.theme.bar.menus.menu.clock.calendar.yearmonth} title="Year/Month" type="color" />
-                <Option opt={options.theme.bar.menus.menu.clock.calendar.weekdays} title="Weekdays" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.calendar.yearmonth}
+                    title="Year/Month"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.calendar.weekdays}
+                    title="Weekdays"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.clock.calendar.paginator}
                     title="Navigation Arrows (Hover)"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.clock.calendar.currentday} title="Current Day" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.calendar.currentday}
+                    title="Current Day"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.menu.clock.calendar.days} title="Days" type="color" />
                 <Option
                     opt={options.theme.bar.menus.menu.clock.calendar.contextdays}
@@ -69,8 +85,16 @@ export const ClockMenuTheme = (): JSX.Element => {
                     title="Current Temperature"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.clock.weather.status} title="Current Status" type="color" />
-                <Option opt={options.theme.bar.menus.menu.clock.weather.stats} title="Current Stats" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.weather.status}
+                    title="Current Status"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.clock.weather.stats}
+                    title="Current Stats"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.clock.weather.thermometer.extremelyhot}
                     title="Thermometer - Extremely Hot"
diff --git a/src/components/settings/pages/theme/menus/dashboard.tsx b/src/components/settings/pages/theme/menus/dashboard.tsx
index 42908a6..85804f6 100644
--- a/src/components/settings/pages/theme/menus/dashboard.tsx
+++ b/src/components/settings/pages/theme/menus/dashboard.tsx
@@ -20,22 +20,50 @@ export const DashboardMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.border.color} title="Border" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.border.color}
+                    title="Border"
+                    type="color"
+                />
 
                 {/* Profile Section */}
                 <Header title="Profile" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.profile.name} title="Profile Name" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.profile.name}
+                    title="Profile Name"
+                    type="color"
+                />
 
                 {/* Power Menu Section */}
                 <Header title="Power Menu" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.powermenu.shutdown} title="Shutdown" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.powermenu.restart} title="Restart" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.powermenu.logout} title="Log Out" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.powermenu.sleep} title="Sleep" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.powermenu.shutdown}
+                    title="Shutdown"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.powermenu.restart}
+                    title="Restart"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.powermenu.logout}
+                    title="Log Out"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.powermenu.sleep}
+                    title="Sleep"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.powermenu.confirmation.card}
                     title="Confirmation Dialog Card"
@@ -84,7 +112,11 @@ export const DashboardMenuTheme = (): JSX.Element => {
                     title="Primary"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.dashboard.shortcuts.text} title="Text" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.shortcuts.text}
+                    title="Text"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.shortcuts.recording}
                     title="Recording"
@@ -191,22 +223,46 @@ export const DashboardMenuTheme = (): JSX.Element => {
                     title="Bar Background"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.cpu.icon} title="CPU Icon" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.cpu.bar} title="CPU Bar" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.cpu.icon}
+                    title="CPU Icon"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.cpu.bar}
+                    title="CPU Bar"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.monitors.cpu.label}
                     title="CPU Label"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.ram.icon} title="RAM Icon" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.ram.bar} title="RAM Bar" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.ram.icon}
+                    title="RAM Icon"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.ram.bar}
+                    title="RAM Bar"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.monitors.ram.label}
                     title="RAM Label"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.gpu.icon} title="GPU Icon" type="color" />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.gpu.bar} title="GPU Bar" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.gpu.icon}
+                    title="GPU Icon"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.gpu.bar}
+                    title="GPU Bar"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.monitors.gpu.label}
                     title="GPU Label"
@@ -217,7 +273,11 @@ export const DashboardMenuTheme = (): JSX.Element => {
                     title="Disk Icon"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.dashboard.monitors.disk.bar} title="Disk Bar" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.dashboard.monitors.disk.bar}
+                    title="Disk Bar"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.dashboard.monitors.disk.label}
                     title="Disk Label"
diff --git a/src/components/settings/pages/theme/menus/index.tsx b/src/components/settings/pages/theme/menus/index.tsx
index 34a723b..4b703fb 100644
--- a/src/components/settings/pages/theme/menus/index.tsx
+++ b/src/components/settings/pages/theme/menus/index.tsx
@@ -45,7 +45,9 @@ export const MenuTheme = (): JSX.Element => {
                 <Option
                     opt={options.wallpaper.image}
                     title="Wallpaper"
-                    subtitle={bind(options.wallpaper.image).as((wallpaper) => wallpaper || 'No Wallpaper Selected')}
+                    subtitle={bind(options.wallpaper.image).as(
+                        (wallpaper) => wallpaper || 'No Wallpaper Selected',
+                    )}
                     type="wallpaper"
                 />
                 <Option opt={options.theme.bar.menus.background} title="Background Color" type="color" />
@@ -99,12 +101,20 @@ export const MenuTheme = (): JSX.Element => {
                 <Option opt={options.theme.bar.menus.switch.enabled} title="Enabled" type="color" />
                 <Option opt={options.theme.bar.menus.switch.disabled} title="Disabled" type="color" />
                 <Option opt={options.theme.bar.menus.switch.radius} title="Switch Radius" type="string" />
-                <Option opt={options.theme.bar.menus.switch.slider_radius} title="Switch Puck Radius" type="string" />
+                <Option
+                    opt={options.theme.bar.menus.switch.slider_radius}
+                    title="Switch Puck Radius"
+                    type="string"
+                />
                 <Option opt={options.theme.bar.menus.switch.puck} title="Puck" type="color" />
 
                 {/* Check/Radio Buttons Section */}
                 <Header title="Check/Radio Buttons" />
-                <Option opt={options.theme.bar.menus.check_radio_button.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.check_radio_button.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.check_radio_button.active} title="Active" type="color" />
 
                 {/* Buttons Section */}
@@ -118,20 +128,40 @@ export const MenuTheme = (): JSX.Element => {
                 {/* Icon Buttons Section */}
                 <Header title="Icon Buttons" />
                 <Option opt={options.theme.bar.menus.iconbuttons.passive} title="Primary" type="color" />
-                <Option opt={options.theme.bar.menus.iconbuttons.active} title="Active/Hovered" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.iconbuttons.active}
+                    title="Active/Hovered"
+                    type="color"
+                />
 
                 {/* Progress Bar Section */}
                 <Header title="Progress Bar" />
-                <Option opt={options.theme.bar.menus.progressbar.radius} title="Progress Bar Radius" type="string" />
+                <Option
+                    opt={options.theme.bar.menus.progressbar.radius}
+                    title="Progress Bar Radius"
+                    type="string"
+                />
                 <Option opt={options.theme.bar.menus.progressbar.foreground} title="Primary" type="color" />
-                <Option opt={options.theme.bar.menus.progressbar.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.progressbar.background}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Slider Section */}
                 <Header title="Slider" />
                 <Option opt={options.theme.bar.menus.slider.primary} title="Primary" type="color" />
                 <Option opt={options.theme.bar.menus.slider.background} title="Background" type="color" />
-                <Option opt={options.theme.bar.menus.slider.backgroundhover} title="Background (Hover)" type="color" />
-                <Option opt={options.theme.bar.menus.slider.slider_radius} title="Slider Puck Radius" type="string" />
+                <Option
+                    opt={options.theme.bar.menus.slider.backgroundhover}
+                    title="Background (Hover)"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.slider.slider_radius}
+                    title="Slider Puck Radius"
+                    type="string"
+                />
                 <Option
                     opt={options.theme.bar.menus.slider.progress_radius}
                     title="Slider/Progress Bar Radius"
@@ -146,7 +176,11 @@ export const MenuTheme = (): JSX.Element => {
 
                 {/* Dropdown Menu Section */}
                 <Header title="Dropdown Menu" />
-                <Option opt={options.theme.bar.menus.dropdownmenu.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.dropdownmenu.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.dropdownmenu.text} title="Text" type="color" />
                 <Option opt={options.theme.bar.menus.dropdownmenu.divider} title="Divider" type="color" />
 
diff --git a/src/components/settings/pages/theme/menus/media.tsx b/src/components/settings/pages/theme/menus/media.tsx
index f1a9962..48a016d 100644
--- a/src/components/settings/pages/theme/menus/media.tsx
+++ b/src/components/settings/pages/theme/menus/media.tsx
@@ -23,7 +23,11 @@ export const MediaMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.media.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.media.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -55,13 +59,25 @@ export const MediaMenuTheme = (): JSX.Element => {
                     subtitle="Ex: Button color when shuffle/loop is enabled."
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.media.buttons.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.media.buttons.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.menu.media.buttons.text} title="Text" type="color" />
 
                 {/* Slider Section */}
                 <Header title="Slider" />
-                <Option opt={options.theme.bar.menus.menu.media.slider.primary} title="Primary Color" type="color" />
-                <Option opt={options.theme.bar.menus.menu.media.slider.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.media.slider.primary}
+                    title="Primary Color"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.media.slider.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.media.slider.backgroundhover}
                     title="Background (Hover)"
diff --git a/src/components/settings/pages/theme/menus/network.tsx b/src/components/settings/pages/theme/menus/network.tsx
index 97241c0..b14c033 100644
--- a/src/components/settings/pages/theme/menus/network.tsx
+++ b/src/components/settings/pages/theme/menus/network.tsx
@@ -24,7 +24,11 @@ export const NetworkMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.network.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -44,28 +48,60 @@ export const NetworkMenuTheme = (): JSX.Element => {
 
                 {/* Switch Section */}
                 <Header title="Switch" />
-                <Option opt={options.theme.bar.menus.menu.network.switch.enabled} title="Enabled" type="color" />
-                <Option opt={options.theme.bar.menus.menu.network.switch.disabled} title="Disabled" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.switch.enabled}
+                    title="Enabled"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.switch.disabled}
+                    title="Disabled"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.menu.network.switch.puck} title="Puck" type="color" />
 
                 {/* List Items Section */}
                 <Header title="List Items" />
-                <Option opt={options.theme.bar.menus.menu.network.listitems.active} title="Active/Hover" type="color" />
-                <Option opt={options.theme.bar.menus.menu.network.listitems.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.listitems.active}
+                    title="Active/Hover"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.listitems.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Icons Section */}
                 <Header title="Icons" />
                 <Option opt={options.theme.bar.menus.menu.network.icons.active} title="Active" type="color" />
-                <Option opt={options.theme.bar.menus.menu.network.icons.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.icons.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Scroller Section */}
                 <Header title="Scroller" />
-                <Option opt={options.theme.bar.menus.menu.network.scroller.color} title="Color" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.scroller.color}
+                    title="Color"
+                    type="color"
+                />
 
                 {/* Icon Buttons Section */}
                 <Header title="Icon Buttons" />
-                <Option opt={options.theme.bar.menus.menu.network.iconbuttons.active} title="Active" type="color" />
-                <Option opt={options.theme.bar.menus.menu.network.iconbuttons.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.iconbuttons.active}
+                    title="Active"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.network.iconbuttons.passive}
+                    title="Passive"
+                    type="color"
+                />
             </box>
         </scrollable>
     );
diff --git a/src/components/settings/pages/theme/menus/notifications.tsx b/src/components/settings/pages/theme/menus/notifications.tsx
index cb87014..5326062 100644
--- a/src/components/settings/pages/theme/menus/notifications.tsx
+++ b/src/components/settings/pages/theme/menus/notifications.tsx
@@ -16,9 +16,17 @@ export const NotificationsMenuTheme = (): JSX.Element => {
             <box vertical>
                 {/* Notifications Menu Theme Settings Section */}
                 <Header title="Notifications Menu Theme Settings" />
-                <Option opt={options.theme.bar.menus.menu.notifications.label} title="Menu Label" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.notifications.label}
+                    title="Menu Label"
+                    type="color"
+                />
                 <Option opt={options.theme.bar.menus.menu.notifications.card} title="Card" type="color" />
-                <Option opt={options.theme.bar.menus.menu.notifications.background} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.notifications.background}
+                    title="Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.notifications.no_notifications_label}
                     title="Empty Notifications Backdrop"
@@ -38,13 +46,21 @@ export const NotificationsMenuTheme = (): JSX.Element => {
 
                 {/* Switch Section */}
                 <Header title="Switch" />
-                <Option opt={options.theme.bar.menus.menu.notifications.switch.enabled} title="Enabled" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.notifications.switch.enabled}
+                    title="Enabled"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.notifications.switch.disabled}
                     title="Disabled"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.notifications.switch.puck} title="Puck" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.notifications.switch.puck}
+                    title="Puck"
+                    type="color"
+                />
 
                 {/* Scrollbar Section */}
                 <Header title="Scrollbar" />
diff --git a/src/components/settings/pages/theme/menus/power.tsx b/src/components/settings/pages/theme/menus/power.tsx
index 482427e..624fa04 100644
--- a/src/components/settings/pages/theme/menus/power.tsx
+++ b/src/components/settings/pages/theme/menus/power.tsx
@@ -16,7 +16,11 @@ export const PowerMenuTheme = (): JSX.Element => {
             <box vertical>
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.power.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -39,7 +43,11 @@ export const PowerMenuTheme = (): JSX.Element => {
                     title="Label Text"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.shutdown.icon} title="Icon" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.shutdown.icon}
+                    title="Icon"
+                    type="color"
+                />
 
                 {/* Reboot Button Section */}
                 <Header title="Reboot Button" />
@@ -53,8 +61,16 @@ export const PowerMenuTheme = (): JSX.Element => {
                     title="Icon Background"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.restart.text} title="Label Text" type="color" />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.restart.icon} title="Icon" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.restart.text}
+                    title="Label Text"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.restart.icon}
+                    title="Icon"
+                    type="color"
+                />
 
                 {/* Logout Button Section */}
                 <Header title="Logout Button" />
@@ -68,8 +84,16 @@ export const PowerMenuTheme = (): JSX.Element => {
                     title="Icon Background"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.logout.text} title="Label Text" type="color" />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.logout.icon} title="Icon" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.logout.text}
+                    title="Label Text"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.logout.icon}
+                    title="Icon"
+                    type="color"
+                />
 
                 {/* Sleep Button Section */}
                 <Header title="Sleep Button" />
@@ -83,8 +107,16 @@ export const PowerMenuTheme = (): JSX.Element => {
                     title="Icon Background"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.sleep.text} title="Label Text" type="color" />
-                <Option opt={options.theme.bar.menus.menu.power.buttons.sleep.icon} title="Icon" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.sleep.text}
+                    title="Label Text"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.power.buttons.sleep.icon}
+                    title="Icon"
+                    type="color"
+                />
             </box>
         </scrollable>
     );
diff --git a/src/components/settings/pages/theme/menus/systray.tsx b/src/components/settings/pages/theme/menus/systray.tsx
index af71ac3..625e2a5 100644
--- a/src/components/settings/pages/theme/menus/systray.tsx
+++ b/src/components/settings/pages/theme/menus/systray.tsx
@@ -21,7 +21,11 @@ export const SystrayMenuTheme = (): JSX.Element => {
                     title="Background"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.systray.dropdownmenu.text} title="Text" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.systray.dropdownmenu.text}
+                    title="Text"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.systray.dropdownmenu.divider}
                     title="Section Divider"
diff --git a/src/components/settings/pages/theme/menus/volume.tsx b/src/components/settings/pages/theme/menus/volume.tsx
index 7320713..890287e 100644
--- a/src/components/settings/pages/theme/menus/volume.tsx
+++ b/src/components/settings/pages/theme/menus/volume.tsx
@@ -24,7 +24,11 @@ export const VolumeMenuTheme = (): JSX.Element => {
 
                 {/* Background Section */}
                 <Header title="Background" />
-                <Option opt={options.theme.bar.menus.menu.volume.background.color} title="Background" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.background.color}
+                    title="Background"
+                    type="color"
+                />
 
                 {/* Border Section */}
                 <Header title="Border" />
@@ -36,17 +40,37 @@ export const VolumeMenuTheme = (): JSX.Element => {
 
                 {/* List Items Section */}
                 <Header title="List Items" />
-                <Option opt={options.theme.bar.menus.menu.volume.listitems.active} title="Active/Hover" type="color" />
-                <Option opt={options.theme.bar.menus.menu.volume.listitems.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.listitems.active}
+                    title="Active/Hover"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.listitems.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Icon Button Section */}
                 <Header title="Icon Button" />
-                <Option opt={options.theme.bar.menus.menu.volume.iconbutton.active} title="Active/Hover" type="color" />
-                <Option opt={options.theme.bar.menus.menu.volume.iconbutton.passive} title="Passive" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.iconbutton.active}
+                    title="Active/Hover"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.iconbutton.passive}
+                    title="Passive"
+                    type="color"
+                />
 
                 {/* Audio Slider Section */}
                 <Header title="Audio Slider" />
-                <Option opt={options.theme.bar.menus.menu.volume.audio_slider.primary} title="Primary" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.audio_slider.primary}
+                    title="Primary"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.volume.audio_slider.background}
                     title="Background"
@@ -57,11 +81,19 @@ export const VolumeMenuTheme = (): JSX.Element => {
                     title="Background (Hover)"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.volume.audio_slider.puck} title="Puck" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.audio_slider.puck}
+                    title="Puck"
+                    type="color"
+                />
 
                 {/* Input Slider Section */}
                 <Header title="Input Slider" />
-                <Option opt={options.theme.bar.menus.menu.volume.input_slider.primary} title="Primary" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.input_slider.primary}
+                    title="Primary"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.bar.menus.menu.volume.input_slider.background}
                     title="Background"
@@ -72,7 +104,11 @@ export const VolumeMenuTheme = (): JSX.Element => {
                     title="Background (Hover)"
                     type="color"
                 />
-                <Option opt={options.theme.bar.menus.menu.volume.input_slider.puck} title="Puck" type="color" />
+                <Option
+                    opt={options.theme.bar.menus.menu.volume.input_slider.puck}
+                    title="Puck"
+                    type="color"
+                />
             </box>
         </scrollable>
     );
diff --git a/src/components/settings/pages/theme/notifications/index.tsx b/src/components/settings/pages/theme/notifications/index.tsx
index e766e20..5b201dd 100644
--- a/src/components/settings/pages/theme/notifications/index.tsx
+++ b/src/components/settings/pages/theme/notifications/index.tsx
@@ -16,7 +16,11 @@ export const NotificationsTheme = (): JSX.Element => {
             <box vertical>
                 {/* Notifications Theme Settings Section */}
                 <Header title="Notifications Theme Settings" />
-                <Option opt={options.theme.notification.background} title="Notification Background" type="color" />
+                <Option
+                    opt={options.theme.notification.background}
+                    title="Notification Background"
+                    type="color"
+                />
                 <Option
                     opt={options.theme.notification.opacity}
                     title="Notification Opacity"
@@ -31,7 +35,11 @@ export const NotificationsTheme = (): JSX.Element => {
                     subtitle="Buttons that perform actions within a notification"
                     type="color"
                 />
-                <Option opt={options.theme.notification.actions.text} title="Action Button Text Color" type="color" />
+                <Option
+                    opt={options.theme.notification.actions.text}
+                    title="Action Button Text Color"
+                    type="color"
+                />
                 <Option opt={options.theme.notification.label} title="Label" type="color" />
                 <Option opt={options.theme.notification.border} title="Border" type="color" />
                 <Option opt={options.theme.notification.time} title="Time Stamp" type="color" />
@@ -42,8 +50,16 @@ export const NotificationsTheme = (): JSX.Element => {
                     subtitle="Icon that accompanies the label. Doesn't apply if icon is an app icon."
                     type="color"
                 />
-                <Option opt={options.theme.notification.close_button.background} title="Dismiss Button" type="color" />
-                <Option opt={options.theme.notification.close_button.label} title="Dismiss Button Text" type="color" />
+                <Option
+                    opt={options.theme.notification.close_button.background}
+                    title="Dismiss Button"
+                    type="color"
+                />
+                <Option
+                    opt={options.theme.notification.close_button.label}
+                    title="Dismiss Button Text"
+                    type="color"
+                />
             </box>
         </scrollable>
     );
diff --git a/src/components/settings/shared/FileChooser.ts b/src/components/settings/shared/FileChooser.ts
index 0068735..181a8d3 100644
--- a/src/components/settings/shared/FileChooser.ts
+++ b/src/components/settings/shared/FileChooser.ts
@@ -3,9 +3,9 @@ import Gtk from 'gi://Gtk?version=3.0';
 import Gio from 'gi://Gio';
 import { bash, Notify } from '../../../lib/utils';
 import icons from '../../../lib/icons/icons';
-import { Config } from '../../../lib/types/filechooser';
-import { hexColorPattern } from '../../../globals/useTheme';
-import { isHexColor } from '../../../globals/variables';
+import { Config } from '../../../lib/types/filechooser.types';
+import { hexColorPattern } from '../../../shared/useTheme';
+import { isHexColor } from '../../../shared/variables';
 
 const { restartCommand } = options.hyprpanel;
 const whiteListedThemeProp = ['theme.bar.buttons.style'];
@@ -158,7 +158,9 @@ export const saveFileDialog = (filePath: string, themeOnly: boolean): void => {
         const jsonString = new TextDecoder('utf-8').decode(content);
         const jsonObject = JSON.parse(jsonString);
 
-        const filteredJsonObject = themeOnly ? filterHexColorPairs(jsonObject) : filterOutHexColorPairs(jsonObject);
+        const filteredJsonObject = themeOnly
+            ? filterHexColorPairs(jsonObject)
+            : filterOutHexColorPairs(jsonObject);
         const filteredContent = JSON.stringify(filteredJsonObject, null, 2);
 
         if (response === Gtk.ResponseType.ACCEPT) {
diff --git a/src/components/settings/shared/Inputter.tsx b/src/components/settings/shared/Inputter.tsx
index f80d641..51f359f 100644
--- a/src/components/settings/shared/Inputter.tsx
+++ b/src/components/settings/shared/Inputter.tsx
@@ -1,4 +1,3 @@
-import { RowProps } from 'src/lib/types/options';
 import { NumberInputter } from './inputs/number';
 import { ObjectInputter } from './inputs/object';
 import { StringInputter } from './inputs/string';
@@ -11,6 +10,7 @@ import { EnumInputter } from './inputs/enum';
 import { FontInputter } from './inputs/font';
 import { Variable } from 'astal';
 import { Gtk } from 'astal/gtk3';
+import { RowProps } from 'src/lib/options/options.types';
 
 const InputField = <T extends string | number | boolean | object>({
     opt,
@@ -29,7 +29,9 @@ const InputField = <T extends string | number | boolean | object>({
 }: InputFieldProps<T>): JSX.Element => {
     switch (type) {
         case 'number':
-            return <NumberInputter opt={opt} min={min} max={max} increment={increment} isUnsaved={isUnsaved} />;
+            return (
+                <NumberInputter opt={opt} min={min} max={max} increment={increment} isUnsaved={isUnsaved} />
+            );
         case 'float':
         case 'object':
             return <ObjectInputter opt={opt} isUnsaved={isUnsaved} className={className} />;
@@ -38,7 +40,9 @@ const InputField = <T extends string | number | boolean | object>({
         case 'enum':
             return <EnumInputter opt={opt} values={enums} />;
         case 'boolean':
-            return <BooleanInputter opt={opt} disabledBinding={disabledBinding} dependencies={dependencies} />;
+            return (
+                <BooleanInputter opt={opt} disabledBinding={disabledBinding} dependencies={dependencies} />
+            );
         case 'img':
             return <ImageInputter opt={opt} />;
         case 'config_import':
@@ -71,7 +75,10 @@ export const Inputter = <T extends string | number | boolean | object>({
     isUnsaved,
 }: InputterProps<T>): JSX.Element => {
     return (
-        <box className={/export|import/.test(type || '') ? '' : 'inputter-container'} valign={Gtk.Align.CENTER}>
+        <box
+            className={/export|import/.test(type || '') ? '' : 'inputter-container'}
+            valign={Gtk.Align.CENTER}
+        >
             <InputField
                 type={type}
                 opt={opt}
diff --git a/src/components/settings/shared/Label.tsx b/src/components/settings/shared/Label.tsx
index 5987ae6..843e10c 100644
--- a/src/components/settings/shared/Label.tsx
+++ b/src/components/settings/shared/Label.tsx
@@ -1,7 +1,11 @@
-import { execAsync } from 'astal';
+import { Binding, execAsync } from 'astal';
 import { Gtk } from 'astal/gtk3';
 
-export const Label = ({ title: name, subtitle: sub = '', subtitleLink = '' }: LabelProps): JSX.Element => {
+export const Label = ({
+    title: name,
+    subtitle: sub = '',
+    subtitleLink = '',
+}: LabelSettingProps): JSX.Element => {
     const Subtitle = (): JSX.Element => {
         if (subtitleLink.length) {
             return (
@@ -15,19 +19,31 @@ export const Label = ({ title: name, subtitle: sub = '', subtitleLink = '' }: La
                 </button>
             );
         }
-        return <label className="options-sublabel" label={sub} halign={Gtk.Align.START} valign={Gtk.Align.CENTER} />;
+        return (
+            <label
+                className="options-sublabel"
+                label={sub}
+                halign={Gtk.Align.START}
+                valign={Gtk.Align.CENTER}
+            />
+        );
     };
 
     return (
         <box halign={Gtk.Align.START} vertical>
-            <label className="options-label" label={name} halign={Gtk.Align.START} valign={Gtk.Align.CENTER} />
+            <label
+                className="options-label"
+                label={name}
+                halign={Gtk.Align.START}
+                valign={Gtk.Align.CENTER}
+            />
             <Subtitle />
         </box>
     );
 };
 
-interface LabelProps {
+export interface LabelSettingProps {
     title: string;
-    subtitle?: string;
+    subtitle?: string | Binding<string>;
     subtitleLink?: string;
 }
diff --git a/src/components/settings/shared/Option/PropertyLabel.tsx b/src/components/settings/shared/Option/PropertyLabel.tsx
index ec27629..ff213ab 100644
--- a/src/components/settings/shared/Option/PropertyLabel.tsx
+++ b/src/components/settings/shared/Option/PropertyLabel.tsx
@@ -1,16 +1,10 @@
 import { Gtk } from 'astal/gtk3';
-import { Label } from '../Label';
+import { Label, LabelSettingProps } from '../Label';
 
-export const PropertyLabel = ({ title, subtitle, subtitleLink }: PropertyLabelProps): JSX.Element => {
+export const PropertyLabel = ({ title, subtitle, subtitleLink }: LabelSettingProps): JSX.Element => {
     return (
         <box halign={Gtk.Align.START} valign={Gtk.Align.CENTER} hexpand>
             <Label title={title} subtitle={subtitle} subtitleLink={subtitleLink} />
         </box>
     );
 };
-
-interface PropertyLabelProps {
-    title: string;
-    subtitle?: string;
-    subtitleLink?: string;
-}
diff --git a/src/components/settings/shared/Option/ResetButton.tsx b/src/components/settings/shared/Option/ResetButton.tsx
index 3246a6f..061d4ec 100644
--- a/src/components/settings/shared/Option/ResetButton.tsx
+++ b/src/components/settings/shared/Option/ResetButton.tsx
@@ -1,10 +1,12 @@
 import { bind } from 'astal';
 import { Gtk } from 'astal/gtk3';
 import icons from 'src/lib/icons/icons';
-import { RowProps } from 'src/lib/types/options';
+import { RowProps } from 'src/lib/options/options.types';
 import { isPrimaryClick } from 'src/lib/utils';
 
-export const ResetButton = <T extends string | number | boolean | object>({ ...props }: RowProps<T>): JSX.Element => {
+export const ResetButton = <T extends string | number | boolean | object>({
+    ...props
+}: RowProps<T>): JSX.Element => {
     return (
         <button
             className={'reset-options'}
diff --git a/src/components/settings/shared/Option/SettingInput.tsx b/src/components/settings/shared/Option/SettingInput.tsx
index 2f04bec..db9f406 100644
--- a/src/components/settings/shared/Option/SettingInput.tsx
+++ b/src/components/settings/shared/Option/SettingInput.tsx
@@ -1,6 +1,6 @@
 import { Variable } from 'astal';
-import { RowProps } from 'src/lib/types/options';
 import { Inputter } from '../Inputter';
+import { RowProps } from 'src/lib/options/options.types';
 
 export const SettingInput = <T extends string | number | boolean | object>({
     className,
diff --git a/src/components/settings/shared/Option/index.tsx b/src/components/settings/shared/Option/index.tsx
index 844368b..9dac338 100644
--- a/src/components/settings/shared/Option/index.tsx
+++ b/src/components/settings/shared/Option/index.tsx
@@ -1,8 +1,8 @@
-import { RowProps } from 'src/lib/types/options';
 import { Variable } from 'astal';
 import { PropertyLabel } from './PropertyLabel';
 import { ResetButton } from './ResetButton';
 import { SettingInput } from './SettingInput';
+import { RowProps } from 'src/lib/options/options.types';
 
 export const Option = <T extends string | number | boolean | object>({
     className,
diff --git a/src/components/settings/shared/inputs/boolean.tsx b/src/components/settings/shared/inputs/boolean.tsx
index 28749c3..809e97a 100644
--- a/src/components/settings/shared/inputs/boolean.tsx
+++ b/src/components/settings/shared/inputs/boolean.tsx
@@ -1,6 +1,6 @@
 import { Binding } from 'astal';
 import { bind, Variable } from 'astal';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 
 import { dependencies as checkDependencies } from 'src/lib/utils';
 
@@ -18,7 +18,11 @@ export const BooleanInputter = <T extends string | number | boolean | object>({
                     return;
                 }
 
-                if (self.active && dependencies !== undefined && !dependencies.every((dep) => checkDependencies(dep))) {
+                if (
+                    self.active &&
+                    dependencies !== undefined &&
+                    !dependencies.every((dep) => checkDependencies(dep))
+                ) {
                     self.active = false;
                     return;
                 }
diff --git a/src/components/settings/shared/inputs/color.tsx b/src/components/settings/shared/inputs/color.tsx
index f2af707..8a70121 100644
--- a/src/components/settings/shared/inputs/color.tsx
+++ b/src/components/settings/shared/inputs/color.tsx
@@ -1,6 +1,6 @@
 import { Gdk } from 'astal/gtk3';
 import ColorButton from 'src/components/shared/ColorButton';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 import { useHook } from 'src/lib/shared/hookHandler';
 
 export const ColorInputter = <T extends string | number | boolean | object>({
diff --git a/src/components/settings/shared/inputs/enum.tsx b/src/components/settings/shared/inputs/enum.tsx
index c36f453..cc71a5f 100644
--- a/src/components/settings/shared/inputs/enum.tsx
+++ b/src/components/settings/shared/inputs/enum.tsx
@@ -1,7 +1,7 @@
-import { Opt } from 'src/lib/option';
 import icons from 'src/lib/icons/icons';
 import { bind } from 'astal';
 import { isPrimaryClick } from 'src/lib/utils';
+import { Opt } from 'src/lib/options';
 
 export const EnumInputter = <T extends string | number | boolean | object>({
     opt,
diff --git a/src/components/settings/shared/inputs/font/index.tsx b/src/components/settings/shared/inputs/font/index.tsx
index 496aef4..eeef2a4 100644
--- a/src/components/settings/shared/inputs/font/index.tsx
+++ b/src/components/settings/shared/inputs/font/index.tsx
@@ -1,6 +1,6 @@
 import FontButton from 'src/components/shared/FontButton';
-import { Opt } from 'src/lib/option';
 import { FontStyle, styleToString } from './utils';
+import { Opt } from 'src/lib/options';
 
 export const FontInputter = <T extends string | number | boolean | object>({
     fontFamily,
diff --git a/src/components/settings/shared/inputs/image.tsx b/src/components/settings/shared/inputs/image.tsx
index afaa360..4d076a2 100644
--- a/src/components/settings/shared/inputs/image.tsx
+++ b/src/components/settings/shared/inputs/image.tsx
@@ -1,12 +1,13 @@
 import { Gtk } from 'astal/gtk3';
 import FileChooserButton from 'src/components/shared/FileChooserButton';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 
 const handleFileSet =
     <T,>(opt: Opt<T>) =>
     (self: Gtk.FileChooserButton): void => {
         const uri = self.get_uri();
-        if (!uri) {
+
+        if (uri === null) {
             return;
         }
 
diff --git a/src/components/settings/shared/inputs/import.tsx b/src/components/settings/shared/inputs/import.tsx
index 1148601..6da8808 100644
--- a/src/components/settings/shared/inputs/import.tsx
+++ b/src/components/settings/shared/inputs/import.tsx
@@ -1,4 +1,4 @@
-import { ThemeExportData } from 'src/lib/types/options';
+import { ThemeExportData } from 'src/lib/options/options.types';
 import { importFiles, saveFileDialog } from '../FileChooser';
 import { isPrimaryClick } from 'src/lib/utils';
 
diff --git a/src/components/settings/shared/inputs/number.tsx b/src/components/settings/shared/inputs/number.tsx
index bc47831..d253f70 100644
--- a/src/components/settings/shared/inputs/number.tsx
+++ b/src/components/settings/shared/inputs/number.tsx
@@ -2,7 +2,7 @@ import { bind, Variable } from 'astal';
 import { Gtk } from 'astal/gtk3';
 import SpinButton from 'src/components/shared/SpinButton';
 import icons from 'src/lib/icons/icons';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 import { useHook } from 'src/lib/shared/hookHandler';
 
 export const NumberInputter = <T extends string | number | boolean | object>({
diff --git a/src/components/settings/shared/inputs/object.tsx b/src/components/settings/shared/inputs/object.tsx
index e0e924d..eded225 100644
--- a/src/components/settings/shared/inputs/object.tsx
+++ b/src/components/settings/shared/inputs/object.tsx
@@ -1,6 +1,6 @@
 import { bind, Variable } from 'astal';
 import icons from 'src/lib/icons/icons';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 
 export const ObjectInputter = <T extends string | number | boolean | object>({
     opt,
diff --git a/src/components/settings/shared/inputs/string.tsx b/src/components/settings/shared/inputs/string.tsx
index 27496b6..5cae4a7 100644
--- a/src/components/settings/shared/inputs/string.tsx
+++ b/src/components/settings/shared/inputs/string.tsx
@@ -1,6 +1,6 @@
 import { bind, Variable } from 'astal';
 import icons from 'src/lib/icons/icons';
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 
 export const StringInputter = <T extends string | number | boolean | object>({
     opt,
diff --git a/src/components/settings/shared/inputs/wallpaper.tsx b/src/components/settings/shared/inputs/wallpaper.tsx
index 238a18d..69b740d 100644
--- a/src/components/settings/shared/inputs/wallpaper.tsx
+++ b/src/components/settings/shared/inputs/wallpaper.tsx
@@ -1,6 +1,7 @@
 import FileChooserButton from 'src/components/shared/FileChooserButton';
-import { Opt } from 'src/lib/option';
 import Wallpaper from 'src/services/Wallpaper';
+import options from 'src/options';
+import { Opt } from 'src/lib/options';
 
 export const WallpaperInputter = <T extends string | number | boolean | object>({
     opt,
@@ -9,10 +10,19 @@ export const WallpaperInputter = <T extends string | number | boolean | object>(
         return (
             <FileChooserButton
                 onFileSet={(self) => {
-                    const newValue: string = decodeURIComponent(self.get_uri()!.replace('file://', ''));
-                    opt.set(newValue as T);
+                    const fileUri = self.get_uri();
+
+                    if (fileUri === null) {
+                        console.warn('Failed to set wallpaper: File URI is null.');
+                        return;
+                    }
+
+                    const filePath: string = decodeURIComponent(fileUri.replace('file://', ''));
+
+                    opt.set(filePath as T);
+
                     if (options.wallpaper.enable.get()) {
-                        Wallpaper.setWallpaper(newValue);
+                        Wallpaper.setWallpaper(filePath);
                     }
                 }}
             />
diff --git a/src/components/settings/side_effects/index.ts b/src/components/settings/side_effects/index.ts
index 0d5e8cc..75c492b 100644
--- a/src/components/settings/side_effects/index.ts
+++ b/src/components/settings/side_effects/index.ts
@@ -1,4 +1,4 @@
-import { Opt } from 'src/lib/option';
+import { Opt } from 'src/lib/options';
 import options from 'src/options';
 
 const { show_numbered, show_icons, showWsIcons, showApplicationIcons } = options.bar.workspaces;
diff --git a/src/globals.d.ts b/src/globals.d.ts
deleted file mode 100644
index 15e7e17..0000000
--- a/src/globals.d.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-/* eslint-disable no-var */
-
-import { Variable } from 'astal';
-import { BarLayouts } from 'src/lib/types/options';
-import { Options } from 'types/variable';
-
-declare global {
-    var useTheme: (filePath: string) => void;
-    var getSystrayItems: () => string;
-    var isWindowVisible: (windowName: string) => boolean;
-    var setLayout: (layout: BarLayouts) => string;
-    var clearAllNotifications: () => Promise<void>;
-    var setWallpaper: (filePath: string) => void;
-
-    var globalWeatherVar: Variable<Weather>;
-    var options: Options;
-    var removingNotifications: Variable<boolean>;
-    var idleInhibit: Variable<boolean>;
-}
-
-export {};
diff --git a/src/lib/behaviors/autoHide.ts b/src/lib/behaviors/autoHide.ts
index fea4f0c..51397eb 100644
--- a/src/lib/behaviors/autoHide.ts
+++ b/src/lib/behaviors/autoHide.ts
@@ -28,7 +28,7 @@ function setBarVisibility(monitorId: number, isVisible: boolean): void {
  * @param client - The Hyprland client that gained focus
  */
 function handleFullscreenClientVisibility(client: AstalHyprland.Client): void {
-    if (!client) {
+    if (client === null) {
         return;
     }
 
@@ -36,7 +36,7 @@ function handleFullscreenClientVisibility(client: AstalHyprland.Client): void {
 
     Variable.derive([bind(fullscreenBinding)], (isFullScreen) => {
         if (autoHide.get() === 'fullscreen') {
-            setBarVisibility(client.monitor.id, !isFullScreen);
+            setBarVisibility(client.monitor.id, !Boolean(isFullScreen));
         }
     });
 }
diff --git a/src/lib/behaviors/batteryWarning.ts b/src/lib/behaviors/batteryWarning.ts
index 1f0a8fb..c48130f 100644
--- a/src/lib/behaviors/batteryWarning.ts
+++ b/src/lib/behaviors/batteryWarning.ts
@@ -1,15 +1,21 @@
 import AstalBattery from 'gi://AstalBattery?version=0.1';
 import icons from '../icons/icons';
 import { Notify } from '../utils';
+import options from 'src/options';
 
 const batteryService = AstalBattery.get_default();
+const {
+    lowBatteryThreshold,
+    lowBatteryNotification,
+    lowBatteryNotificationText,
+    lowBatteryNotificationTitle,
+} = options.menus.power;
 
 export function warnOnLowBattery(): void {
     let sentLowNotification = false;
     let sentHalfLowNotification = false;
 
     batteryService.connect('notify::charging', () => {
-        // Reset it when the battery is put to charge
         if (batteryService.charging) {
             sentLowNotification = false;
             sentHalfLowNotification = false;
@@ -17,24 +23,21 @@ export function warnOnLowBattery(): void {
     });
 
     batteryService.connect('notify::percentage', () => {
-        const { lowBatteryThreshold, lowBatteryNotification, lowBatteryNotificationText, lowBatteryNotificationTitle } =
-            options.menus.power;
-
-        if (!lowBatteryNotification.get() || batteryService.charging) {
+        if (lowBatteryNotification.get() === undefined || batteryService.charging) {
             return;
         }
 
-        // batteryService.percentage will be a double in between 0 and 1, so we multiply it by 100 to convert it to the percentage
         const batteryPercentage = Math.floor(batteryService.percentage * 100);
         const lowThreshold = lowBatteryThreshold.get();
 
-        // To avoid double notifications, we check each of the thresholds and set the correct `sentNotification`, but then
-        // combine them into one notification only
+        // Avoid double notification
         let sendNotification = false;
+
         if (!sentLowNotification && batteryPercentage <= lowThreshold) {
             sentLowNotification = true;
             sendNotification = true;
         }
+
         if (!sentHalfLowNotification && batteryPercentage <= lowThreshold / 2) {
             sentHalfLowNotification = true;
             sendNotification = true;
@@ -42,8 +45,12 @@ export function warnOnLowBattery(): void {
 
         if (sendNotification) {
             Notify({
-                summary: lowBatteryNotificationTitle.get().replaceAll('$POWER_LEVEL', batteryPercentage.toString()),
-                body: lowBatteryNotificationText.get().replaceAll('$POWER_LEVEL', batteryPercentage.toString()),
+                summary: lowBatteryNotificationTitle
+                    .get()
+                    .replaceAll('$POWER_LEVEL', batteryPercentage.toString()),
+                body: lowBatteryNotificationText
+                    .get()
+                    .replaceAll('$POWER_LEVEL', batteryPercentage.toString()),
                 iconName: icons.ui.warning,
                 urgency: 'critical',
             });
diff --git a/src/lib/behaviors/hyprlandRules.ts b/src/lib/behaviors/hyprlandRules.ts
index 2a5bbb1..9b19886 100644
--- a/src/lib/behaviors/hyprlandRules.ts
+++ b/src/lib/behaviors/hyprlandRules.ts
@@ -3,18 +3,18 @@ import AstalHyprland from 'gi://AstalHyprland?version=0.1';
 const hyprlandService = AstalHyprland.get_default();
 
 const floatSettingsDialog = (): void => {
-    hyprlandService.message(`keyword windowrulev2 float, title:^(hyprpanel-settings)$`);
+    hyprlandService.message('keyword windowrulev2 float, title:^(hyprpanel-settings)$');
 
     hyprlandService.connect('config-reloaded', () => {
-        hyprlandService.message(`keyword windowrulev2 float, title:^(hyprpanel-settings)$`);
+        hyprlandService.message('keyword windowrulev2 float, title:^(hyprpanel-settings)$');
     });
 };
 
 const floatFilePicker = (): void => {
-    hyprlandService.message(`keyword windowrulev2 float, title:^((Save|Import) Hyprpanel.*)$`);
+    hyprlandService.message('keyword windowrulev2 float, title:^((Save|Import) Hyprpanel.*)$');
 
     hyprlandService.connect('config-reloaded', () => {
-        hyprlandService.message(`keyword windowrulev2 float, title:^((Save|Import) Hyprpanel.*)$`);
+        hyprlandService.message('keyword windowrulev2 float, title:^((Save|Import) Hyprpanel.*)$');
     });
 };
 
diff --git a/src/lib/constants/appIcons.ts b/src/lib/constants/appIcons.ts
index f7d0589..e8a5130 100644
--- a/src/lib/constants/appIcons.ts
+++ b/src/lib/constants/appIcons.ts
@@ -124,14 +124,16 @@ const overrides = {
  */
 export const defaultApplicationIconMap = defaultWindowTitleMap.reduce(
     (iconMapAccumulator: Record<string, string>, windowTitles) => {
+        const currentIconMap = iconMapAccumulator;
+
         const appName: string = windowTitles[0];
         const appIcon: string = windowTitles[1];
 
-        if (!(appName in iconMapAccumulator)) {
-            iconMapAccumulator[appName] = appIcon;
+        if (!(appName in currentIconMap)) {
+            currentIconMap[appName] = appIcon;
         }
 
-        return iconMapAccumulator;
+        return currentIconMap;
     },
     overrides,
 );
diff --git a/src/lib/constants/options.ts b/src/lib/constants/options.ts
index 5c74179..be3083c 100644
--- a/src/lib/constants/options.ts
+++ b/src/lib/constants/options.ts
@@ -1,5 +1,5 @@
 import { Gtk } from 'astal/gtk3';
-import { DropdownMenuList } from '../types/options';
+import { DropdownMenuList } from '../options/options.types';
 
 export const StackTransitionMap = {
     none: Gtk.StackTransitionType.NONE,
diff --git a/src/lib/option.ts b/src/lib/option.ts
deleted file mode 100644
index 25fa4c8..0000000
--- a/src/lib/option.ts
+++ /dev/null
@@ -1,355 +0,0 @@
-import { MkOptionsResult } from './types/options';
-import Variable from 'astal/variable';
-import { monitorFile, readFile, writeFile } from 'astal/file';
-import { errorHandler, Notify } from './utils';
-import { ensureDirectory } from './session';
-import icons from './icons/icons';
-
-type OptProps = {
-    persistent?: boolean;
-};
-
-type WriteDiskProps = {
-    writeDisk?: boolean;
-};
-
-export class Opt<T = unknown> extends Variable<T> {
-    /**
-     * The initial value set when the `Opt` is created.
-     */
-    public readonly initial: T;
-
-    /**
-     * Indicates whether this option should remain unchanged even when reset operations occur.
-     */
-    public readonly persistent: boolean;
-
-    private _id = '';
-
-    /**
-     * Creates an instance of `Opt`.
-     *
-     * @param {T} initial - The initial value of the option.
-     * @param {OptProps} [props={}] - Additional properties for the option.
-     */
-    constructor(initial: T, { persistent = false }: OptProps = {}) {
-        super(initial);
-        this.initial = initial;
-        this.persistent = persistent;
-    }
-
-    /**
-     * Converts the current value to a JSON-compatible string.
-     *
-     * @returns {string}
-     */
-    toJSON(): string {
-        return `opt:${JSON.stringify(this.get())}`;
-    }
-
-    public get value(): T {
-        return this.get();
-    }
-
-    /**
-     * Setter for the current value of the option.
-     */
-    public set value(val: T) {
-        this.set(val);
-    }
-
-    /**
-     * Getter for the unique ID of the option.
-     */
-    public get id(): string {
-        return this._id;
-    }
-
-    /**
-     * Setter for the unique ID of the option.
-     */
-    public set id(newId: string) {
-        this._id = newId;
-    }
-
-    /**
-     * Initializes this option based on the provided configuration, if available.
-     *
-     * @param config - The configuration.
-     */
-    public init(config: Record<string, unknown>): void {
-        const value = _findVal(config, this._id.split('.'));
-
-        if (value !== undefined) {
-            this.set(value as T, { writeDisk: false });
-        }
-    }
-
-    /**
-     * Set the given configuration value and write it to disk, if specified.
-     *
-     * @param value - The new value.
-     * @param writeDisk - Whether to write the changes to disk. Defaults to true.
-     */
-    public set = (value: T, { writeDisk = true }: WriteDiskProps = {}): void => {
-        if (value === this.get()) {
-            // If nothing actually changed, exit quick
-            return;
-        }
-
-        super.set(value);
-
-        if (writeDisk) {
-            const raw = readFile(CONFIG_FILE);
-            let config: Record<string, unknown> = {};
-            if (raw && raw.trim() !== '') {
-                try {
-                    config = JSON.parse(raw) as Record<string, unknown>;
-                } catch (error) {
-                    // Last thing we want is to reset someones entire config
-                    // so notify them instead
-                    console.error(`Failed to load config file: ${error}`);
-                    Notify({
-                        summary: 'Failed to load config file',
-                        body: `${error}`,
-                        iconName: icons.ui.warning,
-                    });
-
-                    errorHandler(error);
-                }
-            }
-            config[this._id] = value;
-            writeFile(CONFIG_FILE, JSON.stringify(config, null, 2));
-        }
-    };
-
-    /**
-     * Resets the value of this option to its initial value if not persistent and if it differs from the current value.
-     *
-     * @param writeDisk - Whether to write the changes to disk. Defaults to true.
-     * @returns Returns the option's ID if reset occurred, otherwise undefined.
-     */
-    public reset(writeDiskProps: WriteDiskProps = {}): string | undefined {
-        if (this.persistent) {
-            return undefined;
-        }
-
-        let currentValue: string | T = this.get();
-        currentValue = typeof currentValue === 'object' ? JSON.stringify(currentValue) : currentValue;
-        let initialValue: string | T = this.initial;
-        initialValue = typeof initialValue === 'object' ? JSON.stringify(initialValue) : initialValue;
-
-        if (currentValue !== initialValue) {
-            this.set(this.initial, writeDiskProps);
-            return this._id;
-        }
-
-        return undefined;
-    }
-}
-
-function _findVal(obj: Record<string, unknown>, path: string[]): unknown | undefined {
-    const top = path.shift();
-
-    if (!top) {
-        // The path is empty, so this is our value.
-        return obj;
-    }
-
-    if (typeof obj !== 'object') {
-        // Not an array, not an object, but we need to go deeper.
-        // This is invalid, so return.
-        return undefined;
-    }
-
-    const mergedPath = [top, ...path].join('.');
-
-    if (mergedPath in obj) {
-        // The key exists on this level with dot-notation, so we return that.
-        return obj[mergedPath];
-    }
-
-    if (top in obj) {
-        // The value exists but we are not there yet, so we recurse.
-        return _findVal(obj[top] as Record<string, unknown>, path);
-    }
-
-    // Key does not exist :(
-    return undefined;
-}
-
-/**
- * Creates an `Opt` instance with the given initial value and properties.
- * @template T
- * @param initial - The initial value.
- * @param [props] - Additional properties.
- */
-export function opt<T>(initial: T, props?: OptProps): Opt<T> {
-    return new Opt(initial, props);
-}
-
-/**
- * Recursively traverses the provided object to extract all `Opt` instances, assigning IDs to each.
- *
- * @param optionsObj - The object containing `Opt` instances.
- * @param [path=''] - The current path (used internally).
- * @param [arr=[]] - The accumulator array for found `Opt` instances.
- * @returns An array of all found `Opt` instances.
- */
-function getOptions(optionsObj: Record<string, unknown>, path = '', arr: Opt[] = []): Opt[] {
-    try {
-        for (const key in optionsObj) {
-            const value = optionsObj[key];
-            const id = path ? `${path}.${key}` : key;
-
-            if (value instanceof Variable) {
-                const optValue = value as Opt;
-                optValue.id = id;
-                arr.push(optValue);
-            } else if (typeof value === 'object' && value !== null) {
-                getOptions(value as Record<string, unknown>, id, arr);
-            }
-        }
-        return arr;
-    } catch (error) {
-        errorHandler(error);
-    }
-}
-
-/**
- * Creates and initializes options from a given object structure. The returned object
- * includes methods to reset values, reset theme colors, and handle dependencies.
- *
- * @template T extends object
- * @param optionsObj - The object containing nested `Opt` instances.
- * @returns The original object extended with additional methods for handling options.
- */
-export function mkOptions<T extends object>(optionsObj: T): T & MkOptionsResult {
-    ensureDirectory(CONFIG_FILE.split('/').slice(0, -1).join('/'));
-
-    const rawConfig = readFile(CONFIG_FILE);
-
-    let config: Record<string, unknown> = {};
-    if (rawConfig && rawConfig.trim() !== '') {
-        try {
-            config = JSON.parse(rawConfig) as Record<string, unknown>;
-        } catch (error) {
-            Notify({
-                summary: 'Failed to load config file',
-                body: `${error}`,
-                iconName: icons.ui.warning,
-            });
-            // Continue with a broken config, the user has
-            // been warned
-        }
-    }
-
-    // Initialize the config options
-    const allOptions = getOptions(optionsObj as Record<string, unknown>);
-    for (let i = 0; i < allOptions.length; i++) {
-        allOptions[i].init(config);
-    }
-
-    // Setup a file monitor to allow live config edit preview from outside
-    // the config menu
-    const debounceTimeMs = 200;
-    let lastEventTime = Date.now();
-    monitorFile(CONFIG_FILE, () => {
-        if (Date.now() - lastEventTime < debounceTimeMs) {
-            return;
-        }
-        lastEventTime = Date.now();
-
-        let newConfig: Record<string, unknown> = {};
-
-        const rawConfig = readFile(CONFIG_FILE);
-        if (rawConfig && rawConfig.trim() !== '') {
-            try {
-                newConfig = JSON.parse(rawConfig) as Record<string, unknown>;
-            } catch (error) {
-                console.error(`Error loading configuration file: ${error}`);
-                Notify({
-                    summary: 'Loading configuration file failed',
-                    body: `${error}`,
-                    iconName: icons.ui.warning,
-                });
-                return;
-            }
-        }
-
-        for (let i = 0; i < allOptions.length; i++) {
-            const opt = allOptions[i];
-            const newVal = _findVal(newConfig, opt.id.split('.'));
-
-            if (newVal === undefined) {
-                // Set the variable but don't write it back to the file,
-                // as we are getting it from there
-                opt.reset({ writeDisk: false });
-                continue;
-            }
-
-            const oldVal = opt.get();
-            if (newVal !== oldVal) {
-                // Set the variable but don't write it back to the file,
-                // as we are getting it from there
-                opt.set(newVal, { writeDisk: false });
-            }
-        }
-    });
-
-    /**
-     * A simple sleep utility.
-     *
-     * @param [ms=0] - Milliseconds to sleep.
-     */
-    function sleep(ms = 0): Promise<T> {
-        return new Promise((resolve) => setTimeout(resolve, ms));
-    }
-
-    /**
-     * Resets all options to their initial values if possible.
-     *
-     * @param opts - Array of all option instances.
-     * @returns IDs of all reset options.
-     */
-    async function resetAll(opts: Opt[]): Promise<string[]> {
-        const results: string[] = [];
-        for (let i = 0; i < opts.length; i++) {
-            const id = opts[i].reset();
-
-            if (id) {
-                results.push(id);
-                await sleep(50);
-            }
-        }
-        return results;
-    }
-
-    return Object.assign(optionsObj, {
-        array: (): Opt[] => allOptions,
-        async reset(): Promise<string> {
-            const ids = await resetAll(allOptions);
-
-            return ids.join('\n');
-        },
-
-        /**
-         * Registers a callback that fires when any option whose ID starts with any of the given dependencies changes.
-         *
-         * @param deps - An array of dependency prefixes.
-         * @param callback - The callback function to execute on changes.
-         */
-        handler(deps: string[], callback: () => void): void {
-            for (let i = 0; i < allOptions.length; i++) {
-                const opt = allOptions[i];
-
-                for (let j = 0; j < deps.length; j++) {
-                    if (opt.id.startsWith(deps[j])) {
-                        opt.subscribe(callback);
-                        break;
-                    }
-                }
-            }
-        },
-    });
-}
diff --git a/src/lib/options/ConfigManager.ts b/src/lib/options/ConfigManager.ts
new file mode 100644
index 0000000..57dabd8
--- /dev/null
+++ b/src/lib/options/ConfigManager.ts
@@ -0,0 +1,169 @@
+import { readFile, writeFile, monitorFile } from 'astal/file';
+import { errorHandler, Notify } from '../utils';
+import { ensureDirectory } from '../session';
+import icons from '../icons/icons';
+
+/**
+ * Manages configuration file operations including reading, writing, and change monitoring
+ *
+ * The ConfigManager centralizes all configuration persistence operations and provides
+ * utilities for working with nested configuration structures.
+ */
+export class ConfigManager {
+    private _configPath: string;
+    private _changeCallbacks: Array<() => void> = [];
+
+    /**
+     * Creates a new configuration manager for a specific config file
+     *
+     * @param configPath - Path to the configuration file to manage
+     */
+    constructor(configPath: string) {
+        this._configPath = configPath;
+        this._ensureConfigDirectory();
+        this._setupConfigMonitor();
+    }
+
+    /**
+     * Updates a single option in the configuration file
+     *
+     * @param id - Dot-notation path of the option to update
+     * @param value - New value to store for the option
+     */
+    public updateOption(id: string, value: unknown): void {
+        const config = this.readConfig();
+        config[id] = value;
+        this.writeConfig(config);
+    }
+
+    /**
+     * Retrieves a value from a nested object using a path
+     *
+     * @param dataObject - The object to search within
+     * @param path - Dot-notation path or array of path segments
+     * @returns The value at the specified path or undefined if not found
+     */
+    public getNestedValue(dataObject: Record<string, unknown>, path: string | string[]): unknown {
+        const pathArray = typeof path === 'string' ? path.split('.') : path;
+        return this._findValueByPath(dataObject, pathArray);
+    }
+
+    /**
+     * Reads the current configuration from disk
+     *
+     * @returns The parsed configuration object or an empty object if the file doesn't exist
+     */
+    public readConfig(): Record<string, unknown> {
+        const raw = readFile(this._configPath);
+        if (!raw || raw.trim() === '') {
+            return {};
+        }
+        try {
+            return JSON.parse(raw);
+        } catch (error) {
+            this._handleConfigError(error);
+            return {};
+        }
+    }
+
+    /**
+     * Writes configuration to disk
+     *
+     * @param config - The configuration object to serialize and save
+     */
+    public writeConfig(config: Record<string, unknown>): void {
+        writeFile(this._configPath, JSON.stringify(config, null, 2));
+    }
+
+    /**
+     * Registers a callback to be called when the config file changes
+     *
+     * @param callback - Function to execute when config file changes are detected
+     */
+    public onConfigChanged(callback: () => void): void {
+        this._changeCallbacks.push(callback);
+    }
+
+    /**
+     * Recursively navigates an object to find a value at the specified path
+     *
+     * @param currentObject - The object currently being traversed
+     * @param pathKeys - Remaining path segments to navigate
+     * @returns The value at the path or undefined if not found
+     */
+    private _findValueByPath(currentObject: Record<string, unknown>, pathKeys: string[]): unknown {
+        const currentKey = pathKeys.shift();
+        if (currentKey === undefined) {
+            return currentObject;
+        }
+        if (!this._isObject(currentObject)) {
+            return;
+        }
+        const propertyPath = [currentKey, ...pathKeys].join('.');
+        if (propertyPath in currentObject) {
+            return currentObject[propertyPath];
+        }
+        if (!(currentKey in currentObject)) {
+            return;
+        }
+        const currentKeyValue = currentObject[currentKey];
+        if (!this._isObject(currentKeyValue)) {
+            return;
+        }
+        return this._findValueByPath(currentKeyValue, pathKeys);
+    }
+
+    /**
+     * Ensures the directory for the config file exists
+     */
+    private _ensureConfigDirectory(): void {
+        ensureDirectory(this._configPath.split('/').slice(0, -1).join('/'));
+    }
+
+    /**
+     * Sets up file monitoring to detect external changes to the config file
+     */
+    private _setupConfigMonitor(): void {
+        const debounceTimeMs = 200;
+        let lastEventTime = Date.now();
+        monitorFile(this._configPath, () => {
+            if (Date.now() - lastEventTime < debounceTimeMs) {
+                return;
+            }
+            lastEventTime = Date.now();
+            this._notifyConfigChanged();
+        });
+    }
+
+    /**
+     * Notifies all registered callbacks about config file changes
+     */
+    private _notifyConfigChanged(): void {
+        this._changeCallbacks.forEach((callback) => callback());
+    }
+
+    /**
+     * Handles configuration parsing errors with appropriate logging and notification
+     *
+     * @param error - The error that occurred during config parsing
+     */
+    private _handleConfigError(error: unknown): void {
+        console.error(`Failed to load config file: ${error}`);
+        Notify({
+            summary: 'Failed to load config file',
+            body: `${error}`,
+            iconName: icons.ui.warning,
+        });
+        errorHandler(error);
+    }
+
+    /**
+     * Type guard that checks if a value is a non-null object
+     *
+     * @param value - The value to check
+     * @returns True if the value is a non-null object
+     */
+    private _isObject(value: unknown): value is Record<string, unknown> {
+        return typeof value === 'object' && value !== null;
+    }
+}
diff --git a/src/lib/options/Opt.ts b/src/lib/options/Opt.ts
new file mode 100644
index 0000000..c442e24
--- /dev/null
+++ b/src/lib/options/Opt.ts
@@ -0,0 +1,98 @@
+import Variable from 'astal/variable';
+import { ConfigManager } from './ConfigManager';
+
+/**
+ * Properties that can be passed when creating an option
+ */
+export interface OptProps {
+    persistent?: boolean;
+}
+
+/**
+ * Options for set operations
+ */
+export interface WriteOptions {
+    writeDisk?: boolean;
+}
+
+/**
+ * A managed application option with persistence capabilities
+ */
+export class Opt<T = unknown> extends Variable<T> {
+    public readonly initial: T;
+    public readonly persistent: boolean;
+    private _id = '';
+    private _configManager: ConfigManager;
+
+    constructor(initial: T, configManager: ConfigManager, { persistent = false }: OptProps = {}) {
+        super(initial);
+        this.initial = initial;
+        this.persistent = persistent;
+        this._configManager = configManager;
+    }
+
+    public toJSON(): string {
+        return `opt:${JSON.stringify(this.get())}`;
+    }
+
+    public get value(): T {
+        return this.get();
+    }
+
+    public set value(val: T) {
+        this.set(val);
+    }
+
+    public get id(): string {
+        return this._id;
+    }
+
+    public set id(newId: string) {
+        this._id = newId;
+    }
+
+    public init(config: Record<string, unknown>): void {
+        const value = this._configManager.getNestedValue(config, this._id);
+
+        if (value !== undefined) {
+            this.set(value as T, { writeDisk: false });
+        }
+    }
+
+    public set = (value: T, { writeDisk = true }: WriteOptions = {}): void => {
+        if (value === this.get()) {
+            return;
+        }
+
+        super.set(value);
+
+        if (writeDisk) {
+            this._configManager.updateOption(this._id, value);
+        }
+    };
+
+    public reset(writeOptions: WriteOptions = {}): string | undefined {
+        if (this.persistent) {
+            return;
+        }
+
+        const hasChanged = this._hasChangedFromInitial();
+
+        if (hasChanged) {
+            this.set(this.initial, writeOptions);
+            return this._id;
+        }
+
+        return;
+    }
+
+    private _hasChangedFromInitial(): boolean {
+        let currentValue: string | T = this.get();
+        currentValue = typeof currentValue === 'object' ? JSON.stringify(currentValue) : currentValue;
+
+        let initialValue: string | T = this.initial;
+        initialValue = typeof initialValue === 'object' ? JSON.stringify(initialValue) : initialValue;
+
+        return currentValue !== initialValue;
+    }
+}
diff --git a/src/lib/options/OptionRegistry.ts b/src/lib/options/OptionRegistry.ts
new file mode 100644
index 0000000..acdf571
--- /dev/null
+++ b/src/lib/options/OptionRegistry.ts
@@ -0,0 +1,186 @@
+import { Opt } from './Opt';
+import { ConfigManager } from './ConfigManager';
+import { MkOptionsResult, OptionsObject } from './options.types';
+import { errorHandler } from '../utils';
+
+/**
+ * Creates and manages a registry of application options
+ *
+ * Provides functionality to collect, initialize, reset, and track options throughout
+ * the application. Handles configuration synchronization and dependency-based subscriptions.
+ */
+export class OptionRegistry<T extends OptionsObject> {
+    private _options: Opt[] = [];
+    private _optionsObj: T;
+    private _configManager: ConfigManager;
+
+    /**
+     * Creates a new option registry
+     *
+     * @param optionsObj - The object containing option definitions
+     * @param configManager - The configuration manager to handle persistence
+     */
+    constructor(optionsObj: T, configManager: ConfigManager) {
+        this._optionsObj = optionsObj;
+        this._configManager = configManager;
+        this._initializeOptions();
+    }
+
+    /**
+     * Returns all registered options as an array
+     */
+    public toArray(): Opt[] {
+        return this._options;
+    }
+
+    /**
+     * Resets all options to their initial values
+     *
+     * @returns Newline-separated list of IDs for options that were reset
+     */
+    public async reset(): Promise<string> {
+        const results = await this._resetAllOptions(this._options);
+        return results.join('\n');
+    }
+
+    /**
+     * Registers a callback for options matching the provided dependency prefixes
+     *
+     * @param optionsToWatch - Array of option ID prefixes to watch
+     * @param callback - Function to call when matching options change
+     */
+    public handler(optionsToWatch: string[], callback: () => void): void {
+        optionsToWatch.forEach((prefix) => {
+            const matchingOptions = this._options.filter((opt) => opt.id.startsWith(prefix));
+
+            matchingOptions.forEach((opt) => opt.subscribe(callback));
+        });
+    }
+
+    /**
+     * Updates options based on changes to the config file
+     *
+     * Synchronizes in-memory option values with the current state of the config file
+     */
+    public handleConfigFileChange(): void {
+        const newConfig = this._configManager.readConfig();
+
+        for (const opt of this._options) {
+            const newVal = this._configManager.getNestedValue(newConfig, opt.id);
+
+            if (newVal === undefined) {
+                opt.reset({ writeDisk: false });
+                continue;
+            }
+
+            const oldVal = opt.get();
+            if (newVal !== oldVal) {
+                opt.set(newVal, { writeDisk: false });
+            }
+        }
+    }
+
+    /**
+     * Creates the enhanced options object with additional methods
+     *
+     * @returns The original options object enhanced with registry methods
+     */
+    public createEnhancedOptions(): T & MkOptionsResult {
+        return Object.assign(this._optionsObj, {
+            toArray: this.toArray.bind(this),
+            reset: this.reset.bind(this),
+            handler: this.handler.bind(this),
+        });
+    }
+
+    /**
+     * Initializes the option registry by collecting options and setting up monitoring
+     */
+    private _initializeOptions(): void {
+        this._options = this._collectOptions(this._optionsObj);
+        this._initializeFromConfig();
+
+        this._configManager.onConfigChanged(() => {
+            this.handleConfigFileChange();
+        });
+    }
+
+    /**
+     * Initializes option values from the saved configuration
+     */
+    private _initializeFromConfig(): void {
+        const config = this._configManager.readConfig();
+
+        for (const opt of this._options) {
+            opt.init(config);
+        }
+    }
+
+    /**
+     * Recursively collects all option instances from an object structure
+     *
+     * @param sourceObject - The object to search for options
+     * @param path - Current path in the object hierarchy
+     * @returns Array of found option instances
+     */
+    private _collectOptions(sourceObject: Record<string, unknown>, path = ''): Opt[] {
+        const result: Opt[] = [];
+
+        try {
+            for (const key in sourceObject) {
+                const value = sourceObject[key];
+                const id = path ? `${path}.${key}` : key;
+
+                if (value instanceof Opt) {
+                    value.id = id;
+                    result.push(value);
+                } else if (this._isNestedObject(value)) {
+                    result.push(...this._collectOptions(value, id));
+                }
+            }
+        } catch (error) {
+            errorHandler(error);
+        }
+
+        return result;
+    }
+
+    /**
+     * Resets all options to their initial values with a delay between operations
+     *
+     * @param opts - Array of options to reset
+     * @returns Array of IDs for options that were reset
+     */
+    private async _resetAllOptions(opts: Opt[]): Promise<string[]> {
+        const results: string[] = [];
+
+        for (const opt of opts) {
+            const id = opt.reset();
+
+            if (id !== undefined) {
+                results.push(id);
+                await this._sleep(50);
+            }
+        }
+
+        return results;
+    }
+
+    /**
+     * Simple promise-based sleep function
+     *
+     * @param ms - Milliseconds to sleep
+     */
+    private _sleep(ms = 0): Promise<void> {
+        return new Promise((resolve) => setTimeout(resolve, ms));
+    }
+
+    /**
+     * Type guard to check if a value is a non-null object that can be traversed
+     *
+     * @param value - The value to check
+     */
+    private _isNestedObject(value: unknown): value is Record<string, unknown> {
+        return typeof value === 'object' && value !== null;
+    }
+}
diff --git a/src/lib/options/index.ts b/src/lib/options/index.ts
new file mode 100644
index 0000000..6bdc682
--- /dev/null
+++ b/src/lib/options/index.ts
@@ -0,0 +1,25 @@
+import { ConfigManager } from './ConfigManager';
+import { Opt, OptProps } from './Opt';
+import { OptionRegistry } from './OptionRegistry';
+import { MkOptionsResult, OptionsObject } from './options.types';
+
+const CONFIG_PATH = CONFIG_FILE;
+
+const configManager = new ConfigManager(CONFIG_PATH);
+
+/**
+ * Creates an option with the specified initial value
+ */
+export function opt<T>(initial: T, props?: OptProps): Opt<T> {
+    return new Opt(initial, configManager, props);
+}
+
+/**
+ * Creates and initializes an options management system
+ */
+export function mkOptions<T extends OptionsObject>(optionsObj: T): T & MkOptionsResult {
+    const registry = new OptionRegistry(optionsObj, configManager);
+    return registry.createEnhancedOptions();
+}
+
+export { Opt, OptProps, ConfigManager, OptionRegistry };
diff --git a/src/lib/types/options.d.ts b/src/lib/options/options.types.ts
similarity index 88%
rename from src/lib/types/options.d.ts
rename to src/lib/options/options.types.ts
index fec1677..b3ca79b 100644
--- a/src/lib/types/options.d.ts
+++ b/src/lib/options/options.types.ts
@@ -1,15 +1,16 @@
-import { Opt } from 'src/lib/option';
-import { Variable } from 'types/variable';
-import { defaultColorMap } from './defaults/options';
 import { Astal } from 'astal/gtk3';
 import { dropdownMenuList } from '../constants/options';
 import { FontStyle } from 'src/components/settings/shared/inputs/font/utils';
+import { Variable } from 'astal';
+import { defaultColorMap } from '../types/defaults/options.types';
+import { LabelSettingProps } from 'src/components/settings/shared/Label';
+import { Opt } from './Opt';
 
-export type MkOptionsResult = {
-    array: () => Opt[];
+export interface MkOptionsResult {
+    toArray: () => Opt[];
     reset: () => Promise<string>;
-    handler: (deps: string[], callback: () => void) => void;
-};
+    handler: (optionsToWatch: string[], callback: () => void) => void;
+}
 
 export type RecursiveOptionsObject = {
     [key: string]:
@@ -22,6 +23,8 @@ export type RecursiveOptionsObject = {
         | Variable<boolean>;
 };
 
+export type OptionsObject = Record<string, unknown>;
+
 export type BarLocation = 'top' | 'bottom';
 export type AutoHide = 'never' | 'fullscreen' | 'single-window';
 export type BarModule =
@@ -70,7 +73,15 @@ export type NotificationAnchor =
     | 'bottom left'
     | 'left'
     | 'right';
-export type OSDAnchor = 'top left' | 'top' | 'top right' | 'right' | 'bottom right' | 'bottom' | 'bottom left' | 'left';
+export type OSDAnchor =
+    | 'top left'
+    | 'top'
+    | 'top right'
+    | 'right'
+    | 'bottom right'
+    | 'bottom'
+    | 'bottom left'
+    | 'left';
 export type BarButtonStyles = 'default' | 'split' | 'wave' | 'wave2';
 
 export type ThemeExportData = {
@@ -101,7 +112,7 @@ export interface RowProps<T> {
     min?: number;
     disabledBinding?: Variable<boolean>;
     exportData?: ThemeExportData;
-    subtitle?: string | VarType<string> | Opt;
+    subtitle?: LabelSettingProps['subtitle'];
     subtitleLink?: string;
     dependencies?: string[];
     increment?: number;
@@ -196,9 +207,9 @@ export type MatugenVariation = {
     base: HexColor;
     mantle: HexColor;
     crust: HexColor;
-    notifications_closer: HexColor;
-    notifications_background: HexColor;
-    dashboard_btn_text: HexColor;
+    notifications_closer?: HexColor;
+    notifications_background?: HexColor;
+    dashboard_btn_text?: HexColor;
     red2: HexColor;
     peach2: HexColor;
     pink2: HexColor;
@@ -230,9 +241,6 @@ export type MatugenVariation = {
     yellow3: HexColor;
     maroon3: HexColor;
     crust3: HexColor;
-    notifications_closer?: HexColor;
-    notifications_background?: HexColor;
-    dashboard_btn_text?: HexColor;
 };
 export type MatugenScheme =
     | 'content'
@@ -244,6 +252,8 @@ export type MatugenScheme =
     | 'rainbow'
     | 'tonal-spot';
 
+export type MatugenTheme = 'light' | 'dark';
+
 export type MatugenVariations =
     | 'standard_1'
     | 'standard_2'
@@ -255,8 +265,6 @@ export type MatugenVariations =
     | 'vivid_2'
     | 'vivid_3';
 
-type MatugenTheme = 'light' | 'dark';
-
 export type ColorMapKey = keyof typeof defaultColorMap;
 export type ColorMapValue = (typeof defaultColorMap)[ColorMapKey];
 
@@ -264,7 +272,15 @@ export type ScalingPriority = 'gdk' | 'hyprland' | 'both';
 
 export type BluetoothBatteryState = 'paired' | 'connected' | 'always';
 
-export type BorderLocation = 'none' | 'top' | 'right' | 'bottom' | 'left' | 'horizontal' | 'vertical' | 'full';
+export type BorderLocation =
+    | 'none'
+    | 'top'
+    | 'right'
+    | 'bottom'
+    | 'left'
+    | 'horizontal'
+    | 'vertical'
+    | 'full';
 
 export type PositionAnchor = { [key: string]: Astal.WindowAnchor };
 
diff --git a/src/lib/poller/BashPoller.ts b/src/lib/poller/BashPoller.ts
index 424693f..50bbaea 100644
--- a/src/lib/poller/BashPoller.ts
+++ b/src/lib/poller/BashPoller.ts
@@ -1,25 +1,24 @@
-import { Bind } from 'src/lib/types/variable';
-import { GenericFunction } from 'src/lib/types/customModules/generic';
-import { BarModule } from 'src/lib/types/options';
+import { GenericFunction } from '../types/customModules/generic.types';
+import { BarModule } from '../options/options.types';
 import { Poller } from './Poller';
-import { execAsync, Variable } from 'astal';
+import { Binding, execAsync, Variable } from 'astal';
 
 /**
  * A class that manages polling of a variable by executing a bash command at specified intervals.
  */
 export class BashPoller<Value, Parameters extends unknown[]> {
-    private poller: Poller;
+    private _poller: Poller;
 
-    private params: Parameters;
+    private _params: Parameters;
 
     /**
      * Creates an instance of BashPoller.
      *
-     * @param targetVariable - The target variable to poll.
-     * @param trackers - An array of trackers to monitor.
-     * @param pollingInterval - The interval at which polling occurs.
-     * @param updateCommand - The command to update the target variable.
-     * @param pollingFunction - The function to execute during each poll.
+     * @param _targetVariable - The target variable to poll.
+     * @param _trackers - An array of trackers to monitor.
+     * @param _pollingInterval - The interval at which polling occurs.
+     * @param _updateCommand - The command to update the target variable.
+     * @param _pollingFunction - The function to execute during each poll.
      * @param params - Additional parameters for the polling function.
      *
      * @example
@@ -38,16 +37,16 @@ export class BashPoller<Value, Parameters extends unknown[]> {
      * ```
      */
     constructor(
-        private targetVariable: Variable<Value>,
-        private trackers: Bind[],
-        private pollingInterval: Bind,
-        private updateCommand: string,
-        private pollingFunction: GenericFunction<Value, [string, ...Parameters]>,
+        private _targetVariable: Variable<Value>,
+        private _trackers: Binding<unknown>[],
+        private _pollingInterval: Binding<number>,
+        private _updateCommand: string,
+        private _pollingFunction: GenericFunction<Value, [string, ...Parameters]>,
         ...params: Parameters
     ) {
-        this.params = params;
+        this._params = params;
 
-        this.poller = new Poller(this.pollingInterval, this.trackers, this.execute);
+        this._poller = new Poller(this._pollingInterval, this._trackers, this.execute);
     }
 
     /**
@@ -58,10 +57,10 @@ export class BashPoller<Value, Parameters extends unknown[]> {
      */
     public execute = async (): Promise<void> => {
         try {
-            const res = await execAsync(`bash -c "${this.updateCommand}"`);
-            this.targetVariable.set(await this.pollingFunction(res, ...this.params));
+            const res = await execAsync(`bash -c "${this._updateCommand}"`);
+            this._targetVariable.set(await this._pollingFunction(res, ...this._params));
         } catch (error) {
-            console.error(`Error executing bash command "${this.updateCommand}":`, error);
+            console.error(`Error executing bash command "${this._updateCommand}":`, error);
         }
     };
 
@@ -69,14 +68,14 @@ export class BashPoller<Value, Parameters extends unknown[]> {
      * Starts the polling process.
      */
     public start(): void {
-        this.poller.start();
+        this._poller.start();
     }
 
     /**
      * Stops the polling process.
      */
     public stop(): void {
-        this.poller.stop();
+        this._poller.stop();
     }
 
     /**
@@ -85,6 +84,6 @@ export class BashPoller<Value, Parameters extends unknown[]> {
      * @param moduleName - The name of the module to initialize.
      */
     public initialize(moduleName?: BarModule): void {
-        this.poller.initialize(moduleName);
+        this._poller.initialize(moduleName);
     }
 }
diff --git a/src/lib/poller/FunctionPoller.ts b/src/lib/poller/FunctionPoller.ts
index 71b10cb..0857560 100644
--- a/src/lib/poller/FunctionPoller.ts
+++ b/src/lib/poller/FunctionPoller.ts
@@ -1,24 +1,23 @@
-import { Bind } from 'src/lib/types/variable';
-import { GenericFunction } from 'src/lib/types/customModules/generic';
-import { BarModule } from 'src/lib/types/options';
+import { GenericFunction } from '../types/customModules/generic.types';
+import { BarModule } from '../options/options.types';
 import { Poller } from './Poller';
-import { Variable } from 'astal';
+import { Binding, Variable } from 'astal';
 
 /**
  * A class that manages polling of a variable by executing a generic function at specified intervals.
  */
 export class FunctionPoller<Value, Parameters extends unknown[] = []> {
-    private poller: Poller;
+    private _poller: Poller;
 
-    private params: Parameters;
+    private _params: Parameters;
 
     /**
      * Creates an instance of FunctionPoller.
      *
-     * @param targetVariable - The target variable to poll.
-     * @param trackers - An array of trackers to monitor.
-     * @param pollingInterval - The interval at which polling occurs.
-     * @param pollingFunction - The function to execute during each poll.
+     * @param _targetVariable - The target variable to poll.
+     * @param _trackers - An array of trackers to monitor.
+     * @param _pollingInterval - The interval at which polling occurs.
+     * @param _pollingFunction - The function to execute during each poll.
      * @param params - Additional parameters for the polling function.
      *
      * @example
@@ -36,15 +35,15 @@ export class FunctionPoller<Value, Parameters extends unknown[] = []> {
      * ```
      */
     constructor(
-        private targetVariable: Variable<Value>,
-        private trackers: Bind[],
-        private pollingInterval: Bind,
-        private pollingFunction: GenericFunction<Value, Parameters>,
+        private _targetVariable: Variable<Value>,
+        private _trackers: Binding<unknown>[],
+        private _pollingInterval: Binding<number>,
+        private _pollingFunction: GenericFunction<Value, Parameters>,
         ...params: Parameters
     ) {
-        this.params = params;
+        this._params = params;
 
-        this.poller = new Poller(this.pollingInterval, this.trackers, this.execute);
+        this._poller = new Poller(this._pollingInterval, this._trackers, this._execute);
     }
 
     /**
@@ -52,10 +51,10 @@ export class FunctionPoller<Value, Parameters extends unknown[] = []> {
      *
      * The result of the function is assigned to the target variable.
      */
-    private execute = async (): Promise<void> => {
+    private _execute = async (): Promise<void> => {
         try {
-            const result = await this.pollingFunction(...this.params);
-            this.targetVariable.set(result);
+            const result = await this._pollingFunction(...this._params);
+            this._targetVariable.set(result);
         } catch (error) {
             console.error('Error executing polling function:', error);
         }
@@ -65,14 +64,14 @@ export class FunctionPoller<Value, Parameters extends unknown[] = []> {
      * Starts the polling process.
      */
     public start(): void {
-        this.poller.start();
+        this._poller.start();
     }
 
     /**
      * Stops the polling process.
      */
     public stop(): void {
-        this.poller.stop();
+        this._poller.stop();
     }
 
     /**
@@ -81,6 +80,6 @@ export class FunctionPoller<Value, Parameters extends unknown[] = []> {
      * @param moduleName - The name of the module to initialize.
      */
     public initialize(moduleName?: BarModule): void {
-        this.poller.initialize(moduleName);
+        this._poller.initialize(moduleName);
     }
 }
diff --git a/src/lib/poller/Poller.ts b/src/lib/poller/Poller.ts
index 12041c3..2998d8e 100644
--- a/src/lib/poller/Poller.ts
+++ b/src/lib/poller/Poller.ts
@@ -1,7 +1,7 @@
-import { Bind } from 'src/lib/types/variable';
-import { BarModule } from 'src/lib/types/options';
 import { getLayoutItems } from 'src/lib/utils';
-import { AstalIO, interval, Variable } from 'astal';
+import { AstalIO, Binding, interval, Variable } from 'astal';
+import options from 'src/options';
+import { BarModule } from '../options/options.types';
 
 const { layouts } = options.bar;
 
@@ -20,8 +20,8 @@ export class Poller {
      * @param pollingFunction - The function to execute during each poll.
      */
     constructor(
-        private _pollingInterval: Bind,
-        private _trackers: Bind[],
+        private _pollingInterval: Binding<number>,
+        private _trackers: Binding<unknown>[],
         pollingFunction: () => Promise<void>,
     ) {
         this._pollingFunction = pollingFunction;
diff --git a/src/lib/shared/eventHandlers.ts b/src/lib/shared/eventHandlers.ts
index 329a737..5d23482 100644
--- a/src/lib/shared/eventHandlers.ts
+++ b/src/lib/shared/eventHandlers.ts
@@ -1,11 +1,14 @@
-import { GtkWidget } from 'src/lib/types/widget.js';
 import { Gdk } from 'astal/gtk3';
-import { ThrottleFn } from '../types/utils';
+import { ThrottleFn } from '../types/utils.types';
+import { GtkWidget } from '../types/widget.types';
 
 /**
  * Connects a primary click handler and returns a disconnect function.
  */
-export function onPrimaryClick(widget: GtkWidget, handler: (self: GtkWidget, event: Gdk.Event) => void): () => void {
+export function onPrimaryClick(
+    widget: GtkWidget,
+    handler: (self: GtkWidget, event: Gdk.Event) => void,
+): () => void {
     const id = widget.connect('button-press-event', (self: GtkWidget, event: Gdk.Event) => {
         const eventButton = event.get_button()[1];
         if (eventButton === Gdk.BUTTON_PRIMARY) {
@@ -18,7 +21,10 @@ export function onPrimaryClick(widget: GtkWidget, handler: (self: GtkWidget, eve
 /**
  * Connects a secondary click handler and returns a disconnect function.
  */
-export function onSecondaryClick(widget: GtkWidget, handler: (self: GtkWidget, event: Gdk.Event) => void): () => void {
+export function onSecondaryClick(
+    widget: GtkWidget,
+    handler: (self: GtkWidget, event: Gdk.Event) => void,
+): () => void {
     const id = widget.connect('button-press-event', (self: GtkWidget, event: Gdk.Event) => {
         const eventButton = event.get_button()[1];
         if (eventButton === Gdk.BUTTON_SECONDARY) {
@@ -31,7 +37,10 @@ export function onSecondaryClick(widget: GtkWidget, handler: (self: GtkWidget, e
 /**
  * Connects a middle click handler and returns a disconnect function.
  */
-export function onMiddleClick(widget: GtkWidget, handler: (self: GtkWidget, event: Gdk.Event) => void): () => void {
+export function onMiddleClick(
+    widget: GtkWidget,
+    handler: (self: GtkWidget, event: Gdk.Event) => void,
+): () => void {
     const id = widget.connect('button-press-event', (self: GtkWidget, event: Gdk.Event) => {
         const eventButton = event.get_button()[1];
         if (eventButton === Gdk.BUTTON_MIDDLE) {
diff --git a/src/lib/shared/hookHandler.ts b/src/lib/shared/hookHandler.ts
index 7b39624..e2bcdf3 100644
--- a/src/lib/shared/hookHandler.ts
+++ b/src/lib/shared/hookHandler.ts
@@ -35,7 +35,7 @@ export function useHook(
     };
 
     const hookIntoTarget = (): void => {
-        if (signal && isConnectable(hookTarget)) {
+        if (signal !== undefined && isConnectable(hookTarget)) {
             passedWidget.hook(hookTarget, signal, executeSetup);
         } else if (isSubscribable(hookTarget)) {
             passedWidget.hook(hookTarget, executeSetup);
diff --git a/src/lib/shared/media.ts b/src/lib/shared/media.ts
index 04687b5..ed9e880 100644
--- a/src/lib/shared/media.ts
+++ b/src/lib/shared/media.ts
@@ -23,7 +23,8 @@ export const getCurrentPlayer = (
     const playerStillExists = mprisPlayers.some((p) => activePlayer.bus_name === p.bus_name);
 
     const nextPlayerUp = mprisPlayers.sort(
-        (a: AstalMpris.Player, b: AstalMpris.Player) => statusOrder[a.playbackStatus] - statusOrder[b.playbackStatus],
+        (a: AstalMpris.Player, b: AstalMpris.Player) =>
+            statusOrder[a.playbackStatus] - statusOrder[b.playbackStatus],
     )[0];
 
     if (isPlaying || !playerStillExists) {
diff --git a/src/lib/types/astal-extensions.d.ts b/src/lib/types/astal-extensions.d.ts
deleted file mode 100644
index 4de1bf8..0000000
--- a/src/lib/types/astal-extensions.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Gdk } from 'astal/gtk3';
-
-declare module 'astal/gtk3' {
-    interface EventButton extends Gdk.Event {
-        get_root_coords(): [number, number];
-    }
-
-    interface EventScroll extends Gdk.Event {
-        direction: Gdk.ScrollDirection;
-    }
-}
diff --git a/src/lib/types/audio.d.ts b/src/lib/types/audio.d.ts
deleted file mode 100644
index 508e632..0000000
--- a/src/lib/types/audio.d.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-export type InputDevices = Button<Box<Box<Label<Attribute>, Attribute>, Attribute>, Attribute>[];
-
-type DummyDevices = Button<Box<Box<Label<Attribute>, Attribute>, Attribute>, Attribute>[];
-type RealPlaybackDevices = Button<Box<Box<Label<Attribute>, Attribute>, Attribute>, Attribute>[];
-export type PlaybackDevices = DummyDevices | RealPlaybackDevices;
-
-export type MediaTags = {
-    title: string;
-    artists: string;
-    artist: string;
-    album: string;
-    name: string;
-    identity: string;
-};
diff --git a/src/lib/types/audio.types.ts b/src/lib/types/audio.types.ts
new file mode 100644
index 0000000..de54150
--- /dev/null
+++ b/src/lib/types/audio.types.ts
@@ -0,0 +1,8 @@
+export type MediaTags = {
+    title: string;
+    artists: string;
+    artist: string;
+    album: string;
+    name: string;
+    identity: string;
+};
diff --git a/src/lib/types/bar.d.ts b/src/lib/types/bar.types.ts
similarity index 59%
rename from src/lib/types/bar.d.ts
rename to src/lib/types/bar.types.ts
index f535458..a951a02 100644
--- a/src/lib/types/bar.d.ts
+++ b/src/lib/types/bar.types.ts
@@ -1,28 +1,22 @@
-import { Variable } from 'types/variable';
-import Box from 'types/widgets/box';
-import Button, { ButtonProps } from 'types/widgets/button';
-import Label from 'types/widgets/label';
-import { Attribute, Child } from './widget';
 import { Widget } from 'astal/gtk3';
-import { Binding } from 'astal';
+import { Binding, Variable } from 'astal';
 import { Connectable } from 'astal/binding';
-import { CustomBarModuleStyle } from 'src/components/bar/custom_modules/types';
+import { BoxWidget } from './widget.types';
+import { Label } from 'astal/gtk3/widget';
 
 export type BarBoxChild = {
     component: JSX.Element;
     isVisible?: boolean;
-    isVis?: Variable<boolean>;
+    isVis?: Binding<boolean>;
     isBox?: boolean;
     boxClass: string;
     tooltip_text?: string | Binding<string>;
 } & ({ isBox: true; props: Widget.EventBoxProps } | { isBox?: false; props: Widget.ButtonProps });
 
-export type SelfButton = Button<Child, Attribute>;
+export type BoxHook = (self: BoxWidget) => void;
+export type LabelHook = (self: Label) => void;
 
-export type BoxHook = (self: Box<Gtk.Widget, Gtk.Widget>) => void;
-export type LabelHook = (self: Label<Gtk.Widget>) => void;
-
-export type BarModule = {
+export type BarModuleProps = {
     icon?: string | Binding<string>;
     textIcon?: string | Binding<string>;
     useTextIcon?: Binding<boolean>;
@@ -32,11 +26,11 @@ export type BarModule = {
     boundLabel?: string;
     tooltipText?: string | Binding<string>;
     boxClass: string;
-    isVis?: Variable<boolean>;
+    isVis?: Binding<boolean>;
     props?: Widget.ButtonProps;
     showLabel?: boolean;
-    showLabelBinding?: Binding;
-    showIconBinding?: Binding;
+    showLabelBinding?: Binding<boolean>;
+    showIconBinding?: Binding<boolean>;
     hook?: BoxHook;
     connection?: Binding<Connectable>;
 };
diff --git a/src/lib/types/battery.ts b/src/lib/types/battery.types.ts
similarity index 100%
rename from src/lib/types/battery.ts
rename to src/lib/types/battery.types.ts
diff --git a/src/lib/types/cli.d.ts b/src/lib/types/cli.types.ts
similarity index 100%
rename from src/lib/types/cli.d.ts
rename to src/lib/types/cli.types.ts
diff --git a/src/lib/types/customModules/generic.d.ts b/src/lib/types/customModules/generic.types.ts
similarity index 100%
rename from src/lib/types/customModules/generic.d.ts
rename to src/lib/types/customModules/generic.types.ts
diff --git a/src/lib/types/customModules/kbLayout.d.ts b/src/lib/types/customModules/kbLayout.types.ts
similarity index 74%
rename from src/lib/types/customModules/kbLayout.d.ts
rename to src/lib/types/customModules/kbLayout.types.ts
index d56ddad..8ca7985 100644
--- a/src/lib/types/customModules/kbLayout.d.ts
+++ b/src/lib/types/customModules/kbLayout.types.ts
@@ -1,5 +1,3 @@
-import { layoutMap } from 'src/components/bar/modules/kblayout/layouts';
-
 export type KbLabelType = 'layout' | 'code';
 
 export type HyprctlKeyboard = {
@@ -27,6 +25,3 @@ export type HyprctlDeviceLayout = {
     touch: unknown[];
     switches: unknown[];
 };
-
-export type LayoutKeys = keyof typeof layoutMap;
-export type LayoutValues = (typeof layoutMap)[LayoutKeys];
diff --git a/src/lib/types/customModules/network.d.ts b/src/lib/types/customModules/network.types.ts
similarity index 100%
rename from src/lib/types/customModules/network.d.ts
rename to src/lib/types/customModules/network.types.ts
diff --git a/src/lib/types/customModules/utils.d.ts b/src/lib/types/customModules/utils.types.ts
similarity index 87%
rename from src/lib/types/customModules/utils.d.ts
rename to src/lib/types/customModules/utils.types.ts
index a6cef6d..aaefc92 100644
--- a/src/lib/types/customModules/utils.d.ts
+++ b/src/lib/types/customModules/utils.types.ts
@@ -1,6 +1,6 @@
 import { Variable } from 'astal';
-import { Opt } from 'src/lib/option';
-import { Binding } from 'src/lib/utils';
+import { EventArgs } from '../widget.types';
+import { Opt } from 'src/lib/options';
 
 export type InputHandlerEventArgs = {
     cmd?: Opt<string> | Variable<string>;
diff --git a/src/lib/types/dashboard.d.ts b/src/lib/types/dashboard.types.ts
similarity index 65%
rename from src/lib/types/dashboard.d.ts
rename to src/lib/types/dashboard.types.ts
index c6cd41a..4d34784 100644
--- a/src/lib/types/dashboard.d.ts
+++ b/src/lib/types/dashboard.types.ts
@@ -1,3 +1,5 @@
+import { Variable } from 'astal';
+
 export type ShortcutFixed = {
     tooltip: string;
     command: string;
@@ -6,9 +8,9 @@ export type ShortcutFixed = {
 };
 
 export type ShortcutVariable = {
-    tooltip: VarType<string>;
-    command: VarType<string>;
-    icon: VarType<string>;
+    tooltip: Variable<string>;
+    command: Variable<string>;
+    icon: Variable<string>;
     configurable?: true;
 };
 
diff --git a/src/lib/types/defaults/bar.ts b/src/lib/types/defaults/bar.types.ts
similarity index 75%
rename from src/lib/types/defaults/bar.ts
rename to src/lib/types/defaults/bar.types.ts
index 816f594..2fef17e 100644
--- a/src/lib/types/defaults/bar.ts
+++ b/src/lib/types/defaults/bar.types.ts
@@ -1,6 +1,6 @@
 import { Astal } from 'astal/gtk3';
-import { NetstatLabelType, ResourceLabelType } from '../bar';
-import { BarLocation } from '../options';
+import { NetstatLabelType, ResourceLabelType } from '../bar.types';
+import { BarLocation } from '../../options/options.types';
 
 export const LABEL_TYPES: ResourceLabelType[] = ['used/total', 'used', 'free', 'percentage'];
 
diff --git a/src/lib/types/defaults/netstat.ts b/src/lib/types/defaults/netstat.ts
deleted file mode 100644
index 083344b..0000000
--- a/src/lib/types/defaults/netstat.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { RateUnit } from '../bar';
-import { NetworkResourceData } from '../customModules/network';
-
-export const GET_DEFAULT_NETSTAT_DATA = (dataType: RateUnit): NetworkResourceData => {
-    if (dataType === 'auto') {
-        return { in: `0 Kib/s`, out: `0 Kib/s` };
-    }
-
-    return { in: `0 ${dataType}/s`, out: `0 ${dataType}/s` };
-};
diff --git a/src/lib/types/defaults/netstat.types.ts b/src/lib/types/defaults/netstat.types.ts
new file mode 100644
index 0000000..8dd9cba
--- /dev/null
+++ b/src/lib/types/defaults/netstat.types.ts
@@ -0,0 +1,10 @@
+import { RateUnit } from '../bar.types';
+import { NetworkResourceData } from '../customModules/network.types';
+
+export const getDefaultNetstatData = (dataType: RateUnit): NetworkResourceData => {
+    if (dataType === 'auto') {
+        return { in: `0 Kib/s`, out: `0 Kib/s` };
+    }
+
+    return { in: `0 ${dataType}/s`, out: `0 ${dataType}/s` };
+};
diff --git a/src/lib/types/defaults/options.ts b/src/lib/types/defaults/options.types.ts
similarity index 100%
rename from src/lib/types/defaults/options.ts
rename to src/lib/types/defaults/options.types.ts
diff --git a/src/lib/types/defaults/weather.ts b/src/lib/types/defaults/weather.types.ts
similarity index 100%
rename from src/lib/types/defaults/weather.ts
rename to src/lib/types/defaults/weather.types.ts
diff --git a/src/lib/types/dropdownmenu.d.ts b/src/lib/types/dropdownmenu.types.ts
similarity index 62%
rename from src/lib/types/dropdownmenu.d.ts
rename to src/lib/types/dropdownmenu.types.ts
index 2775fd6..987daaf 100644
--- a/src/lib/types/dropdownmenu.d.ts
+++ b/src/lib/types/dropdownmenu.types.ts
@@ -1,14 +1,13 @@
-import { GtkWidget, Transition } from './widget';
 import { Astal, Gtk } from 'astal/gtk3';
-import { WindowProps } from 'astal/gtk3/widget';
-import { Opt } from '../option';
 import { Binding } from 'astal';
+import { WindowProps } from 'astal/gtk3/widget';
 
-export interface DropdownMenuProps extends WindowProps {
+export interface DropdownMenuProps {
     name: string;
-    child?: JSX.Element | JSX.Element[];
+    child?: JSX.Element | JSX.Element[] | Binding<JSX.Element | undefined>;
     layout?: string;
     transition?: Gtk.RevealerTransitionType | Binding<Gtk.RevealerTransitionType>;
     exclusivity?: Astal.Exclusivity;
     fixed?: boolean;
+    onDestroy?: () => void;
 }
diff --git a/src/lib/types/filechooser.d.ts b/src/lib/types/filechooser.types.ts
similarity index 100%
rename from src/lib/types/filechooser.d.ts
rename to src/lib/types/filechooser.types.ts
diff --git a/src/lib/types/globals.d.ts b/src/lib/types/globals.d.ts
deleted file mode 100644
index ecdb39f..0000000
--- a/src/lib/types/globals.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export type MousePos = {
-    source: string;
-    pos: number[];
-};
diff --git a/src/lib/types/gpustat.d.ts b/src/lib/types/gpustat.types.ts
similarity index 94%
rename from src/lib/types/gpustat.d.ts
rename to src/lib/types/gpustat.types.ts
index 2a4db5e..e3a5251 100644
--- a/src/lib/types/gpustat.d.ts
+++ b/src/lib/types/gpustat.types.ts
@@ -1,3 +1,5 @@
+import { Process } from 'astal';
+
 export type GPUStatProcess = {
     username: string;
     command: string;
diff --git a/src/lib/types/mpris.d.ts b/src/lib/types/mpris.types.ts
similarity index 78%
rename from src/lib/types/mpris.d.ts
rename to src/lib/types/mpris.types.ts
index cb840a8..6ce710e 100644
--- a/src/lib/types/mpris.d.ts
+++ b/src/lib/types/mpris.types.ts
@@ -1,5 +1,4 @@
 import AstalMpris from 'gi://AstalMpris?version=0.1';
-import icons2 from '../icons/icons2';
 
 export type PlaybackIconMap = {
     [key in AstalMpris.PlaybackStatus]: string;
diff --git a/src/lib/types/network.d.ts b/src/lib/types/network.types.ts
similarity index 75%
rename from src/lib/types/network.d.ts
rename to src/lib/types/network.types.ts
index 36d092d..b41152f 100644
--- a/src/lib/types/network.d.ts
+++ b/src/lib/types/network.types.ts
@@ -1,5 +1,3 @@
-import { WIFI_STATUS_MAP } from 'src/globals/network';
-
 export type AccessPoint = {
     bssid: string | null;
     address: string | null;
@@ -11,6 +9,4 @@ export type AccessPoint = {
     iconName: string | undefined;
 };
 
-export type WifiStatus = keyof typeof WIFI_STATUS_MAP;
-
 export type WifiIcon = '󰤩' | '󰤨' | '󰤪' | '󰤨' | '󰤩' | '󰤮' | '󰤨' | '󰤥' | '󰤢' | '󰤟' | '󰤯';
diff --git a/src/lib/types/notification.d.ts b/src/lib/types/notification.types.ts
similarity index 93%
rename from src/lib/types/notification.d.ts
rename to src/lib/types/notification.types.ts
index 7830ff4..9b1d0eb 100644
--- a/src/lib/types/notification.d.ts
+++ b/src/lib/types/notification.types.ts
@@ -6,7 +6,7 @@ export interface NotificationArgs {
     iconName?: string;
     id?: number;
     summary?: string;
-    urgency?: Urgency;
+    urgency?: string;
     category?: string;
     timeout?: number;
     transient?: boolean;
diff --git a/src/lib/types/popupwindow.d.ts b/src/lib/types/popupwindow.d.ts
deleted file mode 100644
index 8ad22f6..0000000
--- a/src/lib/types/popupwindow.d.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { Widget } from 'types/widgets/widget';
-import { WindowProps } from 'types/widgets/window';
-import { Transition } from './widget';
-import { Gtk } from 'astal/gtk3';
-
-export type PopupWindowProps = {
-    name: string;
-    child?: JSX.Element | JSX.Element[];
-    layout?: Layouts;
-    transition?: Transition | Binding<Transition>;
-    exclusivity?: Exclusivity;
-} & WindowProps;
-
-export type LayoutFunction = (
-    name: string,
-    child: Widget,
-    transition: Gtk.RevealerTransitionType,
-) => {
-    center: () => Widget;
-    top: () => Widget;
-    'top-right': () => Widget;
-    'top-center': () => Widget;
-    'top-left': () => Widget;
-    'bottom-left': () => Widget;
-    'bottom-center': () => Widget;
-    'bottom-right': () => Widget;
-};
-export type Layouts =
-    | 'center'
-    | 'top'
-    | 'top-right'
-    | 'top-center'
-    | 'top-left'
-    | 'bottom-left'
-    | 'bottom-center'
-    | 'bottom-right';
-
-export type Opts = {
-    className: string;
-    vexpand: boolean;
-};
-
-export type PaddingProps = {
-    name: string;
-    opts?: Opts;
-};
-
-export type PopupRevealerProps = {
-    name: string;
-    child: GtkWidget;
-    transition: Gtk.RevealerTransitionType;
-};
diff --git a/src/lib/types/popupwindow.types.ts b/src/lib/types/popupwindow.types.ts
new file mode 100644
index 0000000..9ff9ea8
--- /dev/null
+++ b/src/lib/types/popupwindow.types.ts
@@ -0,0 +1,51 @@
+import { Astal, Gtk } from 'astal/gtk3';
+import { Binding } from 'astal';
+import { WindowProps } from 'astal/gtk3/widget';
+
+export interface PopupWindowProps extends WindowProps {
+    name: string;
+    child?: JSX.Element;
+    layout?: Layouts;
+    transition?: Gtk.RevealerTransitionType | Binding<Gtk.RevealerTransitionType>;
+    exclusivity?: Astal.Exclusivity;
+}
+
+export type LayoutFunction = (
+    name: string,
+    child: JSX.Element,
+    transition: Gtk.RevealerTransitionType | Binding<Gtk.RevealerTransitionType>,
+) => {
+    center: () => JSX.Element;
+    top: () => JSX.Element;
+    'top-right': () => JSX.Element;
+    'top-center': () => JSX.Element;
+    'top-left': () => JSX.Element;
+    'bottom-left': () => JSX.Element;
+    'bottom-center': () => JSX.Element;
+    'bottom-right': () => JSX.Element;
+};
+export type Layouts =
+    | 'center'
+    | 'top'
+    | 'top-right'
+    | 'top-center'
+    | 'top-left'
+    | 'bottom-left'
+    | 'bottom-center'
+    | 'bottom-right';
+
+export type Opts = {
+    className: string;
+    vexpand: boolean;
+};
+
+export type PaddingProps = {
+    name: string;
+    opts?: Opts;
+};
+
+export type PopupRevealerProps = {
+    name: string;
+    child: JSX.Element;
+    transition: Gtk.RevealerTransitionType | Binding<Gtk.RevealerTransitionType>;
+};
diff --git a/src/lib/types/power.d.ts b/src/lib/types/power.types.ts
similarity index 100%
rename from src/lib/types/power.d.ts
rename to src/lib/types/power.types.ts
diff --git a/src/lib/types/powerprofiles.d.ts b/src/lib/types/powerprofiles.d.ts
deleted file mode 100644
index eba5561..0000000
--- a/src/lib/types/powerprofiles.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import PowerProfiles from 'types/service/powerprofiles.js';
-
-export type PowerProfiles = InstanceType<typeof PowerProfiles>;
-export type PowerProfile = 'power-saver' | 'balanced' | 'performance';
-export type PowerProfileObject = {
-    [key: string]: string;
-};
-
-export type ProfileType = 'balanced' | 'power-saver' | 'performance';
diff --git a/src/lib/types/powerprofiles.types.ts b/src/lib/types/powerprofiles.types.ts
new file mode 100644
index 0000000..2ac30dd
--- /dev/null
+++ b/src/lib/types/powerprofiles.types.ts
@@ -0,0 +1 @@
+export type ProfileType = 'balanced' | 'power-saver' | 'performance';
diff --git a/src/lib/types/systray.d.ts b/src/lib/types/systray.types.ts
similarity index 100%
rename from src/lib/types/systray.d.ts
rename to src/lib/types/systray.types.ts
diff --git a/src/lib/types/utils.d.ts b/src/lib/types/utils.types.ts
similarity index 79%
rename from src/lib/types/utils.d.ts
rename to src/lib/types/utils.types.ts
index ee01c29..39b5298 100644
--- a/src/lib/types/utils.d.ts
+++ b/src/lib/types/utils.types.ts
@@ -1,5 +1,5 @@
-import { EventArgs } from './eventArgs';
-import { Variable } from 'types/variable';
+import { Variable } from 'astal';
+import { EventArgs } from './widget.types';
 
 export type ThrottleFn = (
     cmd: string,
diff --git a/src/lib/types/variable.d.ts b/src/lib/types/variable.d.ts
deleted file mode 100644
index af540dd..0000000
--- a/src/lib/types/variable.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export type Bind = OriginalBinding<GObject.Object, keyof Props<GObject.Object>, unknown>;
diff --git a/src/lib/types/volume.d.ts b/src/lib/types/volume.d.ts
deleted file mode 100644
index 5e2cf32..0000000
--- a/src/lib/types/volume.d.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export type VolumeIcons = {
-    [index: number]: string;
-};
diff --git a/src/lib/types/weather.d.ts b/src/lib/types/weather.types.ts
similarity index 100%
rename from src/lib/types/weather.d.ts
rename to src/lib/types/weather.types.ts
diff --git a/src/lib/types/widget.d.ts b/src/lib/types/widget.types.ts
similarity index 75%
rename from src/lib/types/widget.d.ts
rename to src/lib/types/widget.types.ts
index fe4627a..36eec85 100644
--- a/src/lib/types/widget.d.ts
+++ b/src/lib/types/widget.types.ts
@@ -1,7 +1,6 @@
-import { Gdk, Gtk } from 'astal/gtk3';
-import Box from 'types/widgets/box';
+import { Binding } from 'astal';
+import { Astal, Gdk, Gtk } from 'astal/gtk3';
 
-export type Exclusivity = 'normal' | 'ignore' | 'exclusive';
 export type Anchor = 'left' | 'right' | 'top' | 'down';
 export type Transition = 'none' | 'crossfade' | 'slide_right' | 'slide_left' | 'slide_up' | 'slide_down';
 
@@ -17,19 +16,13 @@ export type Layouts =
 
 export type Attribute = unknown;
 export type Child = Gtk.Widget;
-export type GtkWidget = Gtk.Widget;
-export type BoxWidget = Box<GtkWidget, Child>;
+export type BoxWidget = Gtk.Box;
 export type GdkEvent = Gdk.Event;
 
-export type GButton = Gtk.Button;
-export type GBox = Gtk.Box;
-export type GLabel = Gtk.Label;
-export type GCenterBox = Gtk.Box;
-
 export type EventHandler<Self> = (self: Self, event: Gdk.Event) => boolean | unknown;
 export type EventArgs = {
     clicked: GtkWidget;
-    event: Gdk.EventButton | Gdk.EventScroll;
+    event: Gdk.Event;
 };
 
 export interface WidgetProps {
@@ -48,7 +41,7 @@ export interface GtkWidgetExtended extends Gtk.Widget {
     isVisible?: boolean;
     boxClass?: string;
     isVis?: {
-        bind: (key: string) => Bind;
+        bind: (key: string) => Binding<boolean>;
     };
 }
 
diff --git a/src/lib/types/workspace.d.ts b/src/lib/types/workspace.types.ts
similarity index 100%
rename from src/lib/types/workspace.d.ts
rename to src/lib/types/workspace.types.ts
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 7d04238..5907d52 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -1,18 +1,17 @@
-import { BarModule, NotificationAnchor, PositionAnchor } from './types/options';
-import { OSDAnchor } from './types/options';
-import icons, { substitutes } from './icons/icons';
+import { BarModule, NotificationAnchor, PositionAnchor } from './options/options.types';
+import { OSDAnchor } from './options/options.types';
+import icons from './icons/icons';
 import GLib from 'gi://GLib?version=2.0';
 import GdkPixbuf from 'gi://GdkPixbuf';
-import { NotificationArgs } from './types/notification';
+import { NotificationArgs } from './types/notification.types';
 import { namedColors } from './constants/colors';
 import { distroIcons } from './constants/distro';
 import { distro } from './variables';
 import options from '../options';
 import { Astal, Gdk, Gtk } from 'astal/gtk3';
-import AstalApps from 'gi://AstalApps?version=0.1';
 import { exec, execAsync } from 'astal/process';
 import AstalNotifd from 'gi://AstalNotifd?version=0.1';
-import { Primitive } from './types/utils';
+import { Primitive } from './types/utils.types';
 
 const notifdService = AstalNotifd.get_default();
 
@@ -56,7 +55,7 @@ export function errorHandler(error: unknown): never {
  * @returns The Gtk.IconInfo object if the icon is found, or null if not found.
  */
 export function lookUpIcon(name?: string, size = 16): Gtk.IconInfo | null {
-    if (!name) return null;
+    if (name === undefined) return null;
 
     return Gtk.IconTheme.get_default().lookup_icon(name, size, Gtk.IconLookupFlags.USE_BUILTIN);
 }
@@ -87,37 +86,6 @@ export function getLayoutItems(): BarModule[] {
     return [...new Set(itemsInLayout)];
 }
 
-/**
- * Retrieves the appropriate icon based on the provided name and fallback.
- *
- * This function returns a substitute icon if available, the original name if it exists as a file, or a fallback icon.
- * It also logs a message if no substitute icon is found.
- *
- * @param name The name of the icon to look up.
- * @param fallback The fallback icon to use if the name is not found. Defaults to `icons.missing`.
- *
- * @returns The icon name or the fallback icon.
- */
-export function icon(name: string | null, fallback = icons.missing): string {
-    const validateSubstitute = (name: string): name is keyof typeof substitutes => name in substitutes;
-
-    if (!name) return fallback || '';
-
-    if (GLib.file_test(name, GLib.FileTest.EXISTS)) return name;
-
-    let icon: string = name;
-
-    if (validateSubstitute(name)) {
-        icon = substitutes[name];
-    }
-
-    if (lookUpIcon(icon)) return icon;
-
-    console.log(`No icon substitute "${icon}" for "${name}", fallback: "${fallback}"`);
-
-    return fallback;
-}
-
 /**
  * Executes a bash command asynchronously.
  *
@@ -130,8 +98,8 @@ export function icon(name: string | null, fallback = icons.missing): string {
  * @returns A promise that resolves to the command output as a string.
  */
 export async function bash(strings: TemplateStringsArray | string, ...values: unknown[]): Promise<string> {
-    const cmd =
-        typeof strings === 'string' ? strings : strings.flatMap((str, i) => str + `${values[i] ?? ''}`).join('');
+    const stringsIsString = typeof strings === 'string';
+    const cmd = stringsIsString ? strings : strings.flatMap((str, i) => str + `${values[i] ?? ''}`).join('');
 
     return execAsync(['bash', '-c', cmd]).catch((err) => {
         console.error(cmd, err);
@@ -167,7 +135,7 @@ export async function sh(cmd: string | string[]): Promise<string> {
  * @returns An array of JSX elements, one for each monitor.
  */
 export async function forMonitors(widget: (monitor: number) => Promise<JSX.Element>): Promise<JSX.Element[]> {
-    const n = Gdk.Display.get_default()?.get_n_monitors() || 1;
+    const n = Gdk.Display.get_default()?.get_n_monitors() ?? 1;
 
     return Promise.all(range(n, 0).map(widget));
 }
@@ -219,24 +187,6 @@ export function dependencies(...bins: string[]): boolean {
     return missing.length === 0;
 }
 
-/**
- * Launches an application in a detached process.
- *
- * This function runs the specified application executable in the background using a bash command.
- * It also increments the application's frequency counter.
- *
- * @param app The application to launch.
- */
-export function launchApp(app: AstalApps.Application): void {
-    const exe = app.executable
-        .split(/\s+/)
-        .filter((str) => !str.startsWith('%') && !str.startsWith('@'))
-        .join(' ');
-
-    bash(`${exe} &`);
-    app.frequency += 1;
-}
-
 /**
  * Checks if the provided filepath is a valid image.
  *
@@ -294,13 +244,13 @@ export function Notify(notifPayload: NotificationArgs): void {
 
     let command = 'notify-send';
     command += ` "${notifPayload.summary} "`;
-    if (notifPayload.body) command += ` "${notifPayload.body}" `;
-    if (notifPayload.appName) command += ` -a "${notifPayload.appName}"`;
-    if (notifPayload.iconName) command += ` -i "${notifPayload.iconName}"`;
-    if (notifPayload.urgency) command += ` -u "${notifPayload.urgency}"`;
+    if (notifPayload.body !== undefined) command += ` "${notifPayload.body}" `;
+    if (notifPayload.appName !== undefined) command += ` -a "${notifPayload.appName}"`;
+    if (notifPayload.iconName !== undefined) command += ` -i "${notifPayload.iconName}"`;
+    if (notifPayload.urgency !== undefined) command += ` -u "${notifPayload.urgency}"`;
     if (notifPayload.timeout !== undefined) command += ` -t ${notifPayload.timeout}`;
-    if (notifPayload.category) command += ` -c "${notifPayload.category}"`;
-    if (notifPayload.transient) command += ` -e`;
+    if (notifPayload.category !== undefined) command += ` -c "${notifPayload.category}"`;
+    if (notifPayload.transient !== undefined) command += ' -e';
     if (notifPayload.id !== undefined) command += ` -r ${notifPayload.id}`;
 
     execAsync(command)
@@ -331,7 +281,7 @@ export function getPosition(pos: NotificationAnchor | OSDAnchor): Astal.WindowAn
         left: Astal.WindowAnchor.LEFT,
     };
 
-    return positionMap[pos] || Astal.WindowAnchor.TOP;
+    return positionMap[pos] ?? Astal.WindowAnchor.TOP;
 }
 
 /**
diff --git a/src/options.ts b/src/options.ts
index 7ec9eab..9132042 100644
--- a/src/options.ts
+++ b/src/options.ts
@@ -1,7 +1,6 @@
 import { FontStyle } from './components/settings/shared/inputs/font/utils';
-import { opt, mkOptions } from './lib/option';
-import { NetstatLabelType, RateUnit, ResourceLabelType } from './lib/types/bar';
-import { KbLabelType } from './lib/types/customModules/kbLayout';
+import { NetstatLabelType, RateUnit, ResourceLabelType } from './lib/types/bar.types';
+import { KbLabelType } from './lib/types/customModules/kbLayout.types';
 import {
     ActiveWsIndicator,
     AutoHide,
@@ -14,12 +13,13 @@ import {
     OSDOrientation,
     ScalingPriority,
     WindowLayer,
-} from './lib/types/options';
-import { MatugenScheme, MatugenTheme, MatugenVariations } from './lib/types/options';
-import { SystrayIconMap } from './lib/types/systray';
-import { UnitType } from './lib/types/weather';
-import { Transition } from './lib/types/widget';
-import { ApplicationIcons, WorkspaceIcons, WorkspaceIconsColored } from './lib/types/workspace';
+} from './lib/options/options.types';
+import { MatugenScheme, MatugenTheme, MatugenVariations } from './lib/options/options.types';
+import { SystrayIconMap } from './lib/types/systray.types';
+import { UnitType } from './lib/types/weather.types';
+import { Transition } from './lib/types/widget.types';
+import { ApplicationIcons, WorkspaceIcons, WorkspaceIconsColored } from './lib/types/workspace.types';
+import { mkOptions, opt } from './lib/options';
 
 // WARN: CHANGING THESE VALUES WILL PREVENT MATUGEN COLOR GENERATION FOR THE CHANGED VALUE
 export const colors = {
@@ -1431,5 +1431,4 @@ const options = mkOptions({
     dummy: opt(true),
 });
 
-globalThis['options'] = options;
 export default options;
diff --git a/src/scss/main.scss b/src/scss/main.scss
index 0e9bc30..81c4e7c 100644
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -7,7 +7,6 @@
 }
 
 //general
-@import 'style/colors';
 @import 'style/common/common.scss';
 @import 'style/common/floating-widget.scss';
 @import 'style/common/widget-button.scss';
@@ -28,7 +27,6 @@
 @import 'style/bar/window_title';
 @import 'style/bar/systray';
 @import 'style/bar/notifications';
-@import 'style/bar/power';
 @import 'style/bar/battery';
 @import 'style/bar/style';
 
diff --git a/src/scss/style.ts b/src/scss/style.ts
index 047469c..cedc394 100644
--- a/src/scss/style.ts
+++ b/src/scss/style.ts
@@ -1,124 +1,216 @@
 import options from '../options';
 import { bash, dependencies } from '../lib/utils';
-import { HexColor, MatugenColors, RecursiveOptionsObject } from '../lib/types/options';
+import { MatugenColors } from '../lib/options/options.types';
 import { initializeTrackers } from './optionsTrackers';
-import { generateMatugenColors, getMatugenHex, replaceHexValues } from '../services/matugen/index';
-import { isHexColor } from '../globals/variables';
+import { isHexColor } from '../shared/variables';
 import { readFile, writeFile } from 'astal/file';
 import { App } from 'astal/gtk3';
 import { initializeHotReload } from './utils/hotReload';
+import { matugenService } from 'src/services/matugen';
+import { Opt } from 'src/lib/options';
 
-const deps = ['font', 'theme', 'bar.flatButtons', 'bar.position', 'bar.battery.charging', 'bar.battery.blocks'];
+/**
+ * Central manager for theme styling throughout the application
+ * Handles the transformation of theme options into compiled CSS
+ */
+class ThemeStyleManager {
+    /**
+     * Orchestrates the full theme regeneration process
+     * Falls back to standard theme if Matugen is unavailable
+     */
+    public async applyCss(): Promise<void> {
+        if (!dependencies('sass')) return;
 
-function extractVariables(theme: RecursiveOptionsObject, prefix = '', matugenColors?: MatugenColors): string[] {
-    let result = [] as string[];
-    for (const key in theme) {
-        if (!theme.hasOwnProperty(key)) {
-            continue;
-        }
+        try {
+            const variables = await this._generateThemeVariables();
 
-        const themeValue = theme[key];
+            await this._compileSass(variables);
 
-        const newPrefix = prefix ? `${prefix}-${key}` : key;
-
-        const replacedValue =
-            isHexColor(themeValue.value) && matugenColors !== undefined
-                ? replaceHexValues(themeValue.value, matugenColors)
-                : themeValue.value;
-
-        if (typeof themeValue === 'function') {
-            result.push(`$${newPrefix}: ${replacedValue};`);
-            continue;
-        }
-        if (typeof themeValue !== 'object' || themeValue === null || Array.isArray(themeValue)) continue;
-
-        if (typeof themeValue.value !== 'undefined') {
-            result.push(`$${newPrefix}: ${replacedValue};`);
-        } else {
-            result = result.concat(extractVariables(themeValue, newPrefix, matugenColors));
+            this._applyCss();
+        } catch (error) {
+            console.error(error);
         }
     }
 
-    return result;
-}
+    /**
+     * Decides whether to use Matugen-generated colors or standard theme variables
+     * Controls the main theming strategy based on user configuration
+     *
+     * @returns An array of SCSS variable declarations
+     */
+    private async _generateThemeVariables(): Promise<string[]> {
+        const useMatugen = options.theme.matugen.get();
+        if (!useMatugen) {
+            return this._extractStandardVariables();
+        }
 
-async function extractMatugenizedVariables(matugenColors: MatugenColors): Promise<string[]> {
-    try {
-        const result = [] as string[];
-        const optArray = options.array();
+        const matugenColors = await matugenService.generateMatugenColors();
+        if (!matugenColors) {
+            return this._extractStandardVariables();
+        }
 
-        for (let i = 0; i < optArray.length; i++) {
-            const opt = optArray[i];
-            const name = opt.id;
+        return this._extractMatugenizedVariables(matugenColors);
+    }
 
-            if (name.startsWith('theme.') === false) {
+    /**
+     * Recursively processes theme objects to generate SCSS variables
+     * Handles nested properties by creating properly namespaced variable names
+     *
+     * @returns An array of SCSS variable declarations using standard theme values
+     */
+    private _extractStandardVariables(): string[] {
+        const cssVariables: string[] = [];
+
+        const optArray = options.toArray();
+
+        for (const opt of optArray) {
+            const currentPath = opt.id;
+
+            if (!currentPath.startsWith('theme.')) {
                 continue;
             }
 
-            const value = opt.value;
+            const variableName = this._buildCssVariableName(currentPath);
+            const variable = this._buildCssVariable(variableName, opt);
 
-            if (!isHexColor(value) && matugenColors !== undefined) {
-                result.push(`$${name.replace('theme.', '').split('.').join('-')}: ${value};`);
-                continue;
-            }
-
-            const matugenColor = getMatugenHex(value as HexColor, matugenColors);
-
-            result.push(`$${name.replace('theme.', '').split('.').join('-')}: ${matugenColor};`);
+            cssVariables.push(variable);
         }
 
-        return result;
-    } catch (error) {
-        console.error(error);
-        return [];
+        return cssVariables;
+    }
+
+    /**
+     * Alternative variable extraction when using Matugen's color generation
+     * Processes all theme options and applies Matugen's palette where appropriate
+     *
+     * @param matugenColors - Color palette generated by Matugen service
+     * @returns An array of SCSS variable declarations with Matugen colors applied
+     */
+    private async _extractMatugenizedVariables(matugenColors: MatugenColors): Promise<string[]> {
+        try {
+            const result: string[] = [];
+            const optArray = options.toArray();
+
+            for (const opt of optArray) {
+                const currentPath = opt.id;
+
+                if (!currentPath.startsWith('theme.')) {
+                    continue;
+                }
+
+                const optionValue = opt.get();
+                const variableName = this._buildCssVariableName(currentPath);
+
+                if (!isHexColor(optionValue)) {
+                    result.push(`$${variableName}: ${optionValue};`);
+                    continue;
+                }
+
+                const defaultThemeValue = opt.initial;
+
+                if (!isHexColor(defaultThemeValue)) {
+                    continue;
+                }
+
+                const matugenColor = matugenService.getMatugenHex(defaultThemeValue, matugenColors);
+                result.push(`$${variableName}: ${matugenColor};`);
+            }
+
+            return result;
+        } catch (error) {
+            console.error(error);
+            return [];
+        }
+    }
+
+    /**
+     * Handles object properties that have values needing transformation
+     * Creates properly formatted SCSS variable declarations
+     *
+     * @param variableName - CSS-friendly variable name
+     * @param property - Option object containing the property value
+     * @returns Formatted SCSS variable declaration
+     */
+    private _buildCssVariable(variableName: string, property: Opt): string {
+        const propertyValue = property.get();
+
+        return `$${variableName}: ${propertyValue};`;
+    }
+
+    /**
+     * Transforms dotted paths into hyphenated CSS variable names
+     * Strips the "theme." prefix for cleaner variable naming
+     *
+     * @param path - Dot-notation path of an option (e.g., "theme.background.primary")
+     * @returns CSS-friendly variable name (e.g., "background-primary")
+     */
+    private _buildCssVariableName(path: string): string {
+        return path.replace('theme.', '').split('.').join('-');
+    }
+
+    /**
+     * Executes the SCSS compilation process with generated variables
+     * Combines main SCSS with custom variables and module styles
+     *
+     * @param themeVariables - Array of SCSS variable declarations for user customization options
+     *
+     * File paths used in compilation:
+     * - themeVariablesPath: Contains all user-configurable variables (theme colors, margins, borders, etc.)
+     * - appScssPath: The application's main SCSS entry point file
+     * - entryScssPath: A temporary file that combines all SCSS sources in the correct order
+     * - modulesScssPath: User-defined custom module styles
+     * - compiledCssPath: The final compiled CSS that gets used by the application
+     */
+    private async _compileSass(themeVariables: string[]): Promise<void> {
+        const themeVariablesPath = `${TMP}/variables.scss`;
+        const appScssPath = `${SRC_DIR}/src/scss/main.scss`;
+        const entryScssPath = `${TMP}/entry.scss`;
+        const modulesScssPath = `${CONFIG_DIR}/modules.scss`;
+        const compiledCssPath = `${TMP}/main.css`;
+
+        const scssImports = [`@import '${themeVariablesPath}';`];
+
+        writeFile(themeVariablesPath, themeVariables.join('\n'));
+
+        let combinedScss = readFile(appScssPath);
+        combinedScss = `${scssImports.join('\n')}\n${combinedScss}`;
+
+        const moduleCustomizations = readFile(modulesScssPath);
+        combinedScss = `${combinedScss}\n${moduleCustomizations}`;
+
+        writeFile(entryScssPath, combinedScss);
+
+        await bash(`sass --load-path=${SRC_DIR}/src/scss ${entryScssPath} ${compiledCssPath}`);
+    }
+
+    /**
+     * Loads the compiled CSS into the application
+     *
+     * @remarks
+     * Uses the compiled CSS file generated in _compileSass to apply styles to the application
+     */
+    private _applyCss(): void {
+        const compiledCssPath = `${TMP}/main.css`;
+
+        App.apply_css(compiledCssPath, true);
     }
 }
 
-export const resetCss = async (): Promise<void> => {
-    if (!dependencies('sass')) return;
+const themeManager = new ThemeStyleManager();
+const optionsToWatch = [
+    'font',
+    'theme',
+    'bar.flatButtons',
+    'bar.position',
+    'bar.battery.charging',
+    'bar.battery.blocks',
+];
 
-    let variables: string[] = [];
-    try {
-        const matugenColors = await generateMatugenColors();
-
-        if (options.theme.matugen.get() && matugenColors) {
-            variables = await extractMatugenizedVariables(matugenColors);
-        } else {
-            variables = extractVariables(options.theme as RecursiveOptionsObject, '', undefined);
-        }
-
-        const vars = `${TMP}/variables.scss`;
-        const css = `${TMP}/main.css`;
-        const scss = `${TMP}/entry.scss`;
-        const localScss = `${SRC_DIR}/src/scss/main.scss`;
-        const moduleScss = `${CONFIG_DIR}/modules.scss`;
-
-        const themeVariables = variables;
-        const integratedVariables = themeVariables;
-
-        const imports = [vars].map((f) => `@import '${f}';`);
-
-        writeFile(vars, integratedVariables.join('\n'));
-
-        let mainScss = readFile(localScss);
-        mainScss = `${imports}\n${mainScss}`;
-
-        const moduleScssFile = readFile(moduleScss);
-        mainScss = `${mainScss}\n${moduleScssFile}`;
-
-        writeFile(scss, mainScss);
-
-        await bash(`sass --load-path=${SRC_DIR}/src/scss ${scss} ${css}`);
-
-        App.apply_css(css, true);
-    } catch (error) {
-        console.error(error);
-    }
-};
-
-initializeTrackers(resetCss);
+initializeTrackers(themeManager.applyCss.bind(themeManager));
 initializeHotReload();
 
-options.handler(deps, resetCss);
+options.handler(optionsToWatch, themeManager.applyCss.bind(themeManager));
 
-await resetCss();
+await themeManager.applyCss();
+
+export { themeManager };
diff --git a/src/scss/style/bar/power.scss b/src/scss/style/bar/power.scss
deleted file mode 100644
index e872b0f..0000000
--- a/src/scss/style/bar/power.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-.bar-power_label {
-  color: $red;
-  margin-top: 0.2rem;
-}
diff --git a/src/scss/style/bar/style.scss b/src/scss/style/bar/style.scss
index 842e205..421c7d8 100644
--- a/src/scss/style/bar/style.scss
+++ b/src/scss/style/bar/style.scss
@@ -72,7 +72,8 @@ $style-module-defaults: (
             );
             border: if(
                 $border-enabled or $bar-buttons-enableBorders,
-                $bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-borderColor, $border-color),
+                $bar-buttons-borderSize solid
+                    if($bar-buttons-monochrome, $bar-buttons-borderColor, $border-color),
                 0em
             );
 
@@ -336,7 +337,7 @@ $style-module-defaults: (
 @include styleModule(
     'powermodule',
     (
-        'text-color': $red,
+        'text-color': $bar-buttons-modules-power-icon,
         'icon-color': $bar-buttons-modules-power-icon,
         'icon-background': $bar-buttons-modules-power-icon_background,
         'label-background': $bar-buttons-modules-power-background,
diff --git a/src/scss/style/colors.scss b/src/scss/style/colors.scss
index a117726..d98736b 100644
--- a/src/scss/style/colors.scss
+++ b/src/scss/style/colors.scss
@@ -1,16 +1,9 @@
-$primary-color: #CDD6F4;
+$primary-color: #cdd6f4;
 $dark-background: #0e0e1e;
 $light-background: #1e1e2e;
-$mauve: #cba6f7;
-$red: #f38ba8;
-$yellow: #f9e2af;
 $orange: #fab387;
-$teal: #94e2d5;
 $lightteal: #bac2de;
-$pink: #f5c2e7;
-$green: #a6e3a1;
 $grey: #585b70;
-$blue: #89b4fa;
 $lightgrey: #a6adc8;
 $lightblue: #74c7ec;
 
diff --git a/src/scss/utils/hotReload.ts b/src/scss/utils/hotReload.ts
index 1ff4283..be989a5 100644
--- a/src/scss/utils/hotReload.ts
+++ b/src/scss/utils/hotReload.ts
@@ -1,5 +1,5 @@
 import { monitorFile } from 'astal';
-import { resetCss } from '../style';
+import { themeManager } from '../style';
 
 export const initializeHotReload = async (): Promise<void> => {
     const monitorList = [
@@ -15,5 +15,5 @@ export const initializeHotReload = async (): Promise<void> => {
         `${CONFIG_DIR}/modules.scss`,
     ];
 
-    monitorList.forEach((file) => monitorFile(file, resetCss));
+    monitorList.forEach((file) => monitorFile(file, themeManager.applyCss.bind(themeManager)));
 };
diff --git a/src/services/Brightness.ts b/src/services/Brightness.ts
index 606732d..12eef2e 100644
--- a/src/services/Brightness.ts
+++ b/src/services/Brightness.ts
@@ -2,15 +2,15 @@ import { exec, GObject, monitorFile, property, readFileAsync, register } from 'a
 import { sh } from 'src/lib/utils';
 
 const get = (args: string): number => Number(exec(`brightnessctl ${args}`));
-const screen = exec(`bash -c "ls -w1 /sys/class/backlight | head -1"`);
-const kbd = exec(`bash -c "ls -w1 /sys/class/leds | grep '::kbd_backlight$' | head -1"`);
+const screen = exec('bash -c "ls -w1 /sys/class/backlight | head -1"');
+const kbd = exec('bash -c "ls -w1 /sys/class/leds | grep \'::kbd_backlight$\' | head -1"');
 
 @register({ GTypeName: 'Brightness' })
 export default class Brightness extends GObject.Object {
-    static instance: Brightness;
+    public static instance: Brightness;
 
-    static get_default(): Brightness {
-        if (!Brightness.instance) {
+    public static get_default(): Brightness {
+        if (Brightness.instance === undefined) {
             Brightness.instance = new Brightness();
         }
         return Brightness.instance;
@@ -22,16 +22,16 @@ export default class Brightness extends GObject.Object {
     #screen = screen?.length ? get(`--device ${screen} get`) / (get(`--device ${screen} max`) || 1) : 0;
 
     @property(Number)
-    get kbd(): number {
+    public get kbd(): number {
         return this.#kbd;
     }
 
     @property(Number)
-    get screen(): number {
+    public get screen(): number {
         return this.#screen;
     }
 
-    set kbd(value: number) {
+    public set kbd(value: number) {
         if (value < 0 || value > this.#kbdMax || !kbd?.length) return;
 
         sh(`brightnessctl -d ${kbd} s ${value} -q`).then(() => {
@@ -40,15 +40,17 @@ export default class Brightness extends GObject.Object {
         });
     }
 
-    set screen(percent: number) {
+    public set screen(percent: number) {
         if (!screen?.length) return;
 
-        if (percent < 0) percent = 0;
+        let brightnessPct = percent;
 
-        if (percent > 1) percent = 1;
+        if (percent < 0) brightnessPct = 0;
 
-        sh(`brightnessctl set ${Math.round(percent * 100)}% -d ${screen} -q`).then(() => {
-            this.#screen = percent;
+        if (percent > 1) brightnessPct = 1;
+
+        sh(`brightnessctl set ${Math.round(brightnessPct * 100)}% -d ${screen} -q`).then(() => {
+            this.#screen = brightnessPct;
             this.notify('screen');
         });
     }
diff --git a/src/services/Cpu.ts b/src/services/Cpu.ts
index 5ecb6c0..7c8dfd0 100644
--- a/src/services/Cpu.ts
+++ b/src/services/Cpu.ts
@@ -5,20 +5,25 @@ import GTop from 'gi://GTop';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
 
 class Cpu {
-    private updateFrequency = Variable(2000);
-    private previousCpuData = new GTop.glibtop_cpu();
-    private cpuPoller: FunctionPoller<number, []>;
+    private _updateFrequency = Variable(2000);
+    private _previousCpuData = new GTop.glibtop_cpu();
+    private _cpuPoller: FunctionPoller<number, []>;
 
     public cpu = Variable(0);
 
     constructor() {
-        GTop.glibtop_get_cpu(this.previousCpuData);
+        GTop.glibtop_get_cpu(this._previousCpuData);
 
         this.calculateUsage = this.calculateUsage.bind(this);
 
-        this.cpuPoller = new FunctionPoller<number, []>(this.cpu, [], bind(this.updateFrequency), this.calculateUsage);
+        this._cpuPoller = new FunctionPoller<number, []>(
+            this.cpu,
+            [],
+            bind(this._updateFrequency),
+            this.calculateUsage,
+        );
 
-        this.cpuPoller.initialize();
+        this._cpuPoller.initialize();
     }
 
     public calculateUsage(): number {
@@ -26,26 +31,26 @@ class Cpu {
         GTop.glibtop_get_cpu(currentCpuData);
 
         // Calculate the differences from the previous to current data
-        const totalDiff = currentCpuData.total - this.previousCpuData.total;
-        const idleDiff = currentCpuData.idle - this.previousCpuData.idle;
+        const totalDiff = currentCpuData.total - this._previousCpuData.total;
+        const idleDiff = currentCpuData.idle - this._previousCpuData.idle;
 
         const cpuUsagePercentage = totalDiff > 0 ? ((totalDiff - idleDiff) / totalDiff) * 100 : 0;
 
-        this.previousCpuData = currentCpuData;
+        this._previousCpuData = currentCpuData;
 
         return cpuUsagePercentage;
     }
 
     public updateTimer(timerInMs: number): void {
-        this.updateFrequency.set(timerInMs);
+        this._updateFrequency.set(timerInMs);
     }
 
     public stopPoller(): void {
-        this.cpuPoller.stop();
+        this._cpuPoller.stop();
     }
 
     public startPoller(): void {
-        this.cpuPoller.start();
+        this._cpuPoller.start();
     }
 }
 
diff --git a/src/services/Gpu.ts b/src/services/Gpu.ts
index 1c2801f..ff41633 100644
--- a/src/services/Gpu.ts
+++ b/src/services/Gpu.ts
@@ -2,25 +2,25 @@
 
 import { bind, exec, Variable } from 'astal';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
-import { GPUStat } from 'src/lib/types/gpustat';
+import { GPUStat } from 'src/lib/types/gpustat.types';
 
 class Gpu {
-    private updateFrequency = Variable(2000);
-    private gpuPoller: FunctionPoller<number, []>;
+    private _updateFrequency = Variable(2000);
+    private _gpuPoller: FunctionPoller<number, []>;
 
     public gpuUsage = Variable<number>(0);
 
     constructor() {
         this.calculateUsage = this.calculateUsage.bind(this);
 
-        this.gpuPoller = new FunctionPoller<number, []>(
+        this._gpuPoller = new FunctionPoller<number, []>(
             this.gpuUsage,
             [],
-            bind(this.updateFrequency),
+            bind(this._updateFrequency),
             this.calculateUsage,
         );
 
-        this.gpuPoller.initialize();
+        this._gpuPoller.initialize();
     }
 
     public calculateUsage(): number {
@@ -38,7 +38,7 @@ class Gpu {
                     return acc + gpu['utilization.gpu'];
                 }, 0) / data.gpus.length;
 
-            return this.divide([totalGpu, usedGpu]);
+            return this._divide([totalGpu, usedGpu]);
         } catch (error) {
             if (error instanceof Error) {
                 console.error('Error getting GPU stats:', error.message);
@@ -49,20 +49,20 @@ class Gpu {
         }
     }
 
-    private divide([total, free]: number[]): number {
+    private _divide([total, free]: number[]): number {
         return free / total;
     }
 
-    updateTimer(timerInMs: number): void {
-        this.updateFrequency.set(timerInMs);
+    public updateTimer(timerInMs: number): void {
+        this._updateFrequency.set(timerInMs);
     }
 
     public stopPoller(): void {
-        this.gpuPoller.stop();
+        this._gpuPoller.stop();
     }
 
     public startPoller(): void {
-        this.gpuPoller.start();
+        this._gpuPoller.start();
     }
 }
 
diff --git a/src/services/Ram.ts b/src/services/Ram.ts
index 388ee62..e8b962f 100644
--- a/src/services/Ram.ts
+++ b/src/services/Ram.ts
@@ -2,32 +2,32 @@
 
 import { bind, GLib, Variable } from 'astal';
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 class Ram {
-    private updateFrequency = Variable(2000);
-    private shouldRound = false;
-    private ramPoller: FunctionPoller<GenericResourceData, []>;
+    private _updateFrequency = Variable(2000);
+    private _shouldRound = false;
+    private _ramPoller: FunctionPoller<GenericResourceData, []>;
 
     public ram = Variable<GenericResourceData>({ total: 0, used: 0, percentage: 0, free: 0 });
 
     constructor() {
         this.calculateUsage = this.calculateUsage.bind(this);
-        this.ramPoller = new FunctionPoller<GenericResourceData, []>(
+        this._ramPoller = new FunctionPoller<GenericResourceData, []>(
             this.ram,
             [],
-            bind(this.updateFrequency),
+            bind(this._updateFrequency),
             this.calculateUsage,
         );
 
-        this.ramPoller.initialize('ram');
+        this._ramPoller.initialize('ram');
     }
 
     public calculateUsage(): GenericResourceData {
         try {
             const [success, meminfoBytes] = GLib.file_get_contents('/proc/meminfo');
 
-            if (!success || !meminfoBytes) {
+            if (!success || meminfoBytes === undefined) {
                 throw new Error('Failed to read /proc/meminfo or file content is null.');
             }
 
@@ -47,7 +47,7 @@ class Ram {
             usedRam = isNaN(usedRam) || usedRam < 0 ? 0 : usedRam;
 
             return {
-                percentage: this.divide([totalRamInBytes, usedRam]),
+                percentage: this._divide([totalRamInBytes, usedRam]),
                 total: totalRamInBytes,
                 used: usedRam,
                 free: availableRamInBytes,
@@ -59,29 +59,29 @@ class Ram {
     }
 
     public setShouldRound(round: boolean): void {
-        this.shouldRound = round;
+        this._shouldRound = round;
     }
 
-    private divide([total, used]: number[]): number {
+    private _divide([total, used]: number[]): number {
         const percentageTotal = (used / total) * 100;
 
-        if (this.shouldRound) {
+        if (this._shouldRound) {
             return total > 0 ? Math.round(percentageTotal) : 0;
         }
 
         return total > 0 ? parseFloat(percentageTotal.toFixed(2)) : 0;
     }
 
-    updateTimer(timerInMs: number): void {
-        this.updateFrequency.set(timerInMs);
+    public updateTimer(timerInMs: number): void {
+        this._updateFrequency.set(timerInMs);
     }
 
     public stopPoller(): void {
-        this.ramPoller.stop();
+        this._ramPoller.stop();
     }
 
     public startPoller(): void {
-        this.ramPoller.start();
+        this._ramPoller.start();
     }
 }
 
diff --git a/src/services/Storage.ts b/src/services/Storage.ts
index 509a858..07743b3 100644
--- a/src/services/Storage.ts
+++ b/src/services/Storage.ts
@@ -4,25 +4,25 @@ import { bind, Variable } from 'astal';
 import GTop from 'gi://GTop';
 
 import { FunctionPoller } from 'src/lib/poller/FunctionPoller';
-import { GenericResourceData } from 'src/lib/types/customModules/generic';
+import { GenericResourceData } from 'src/lib/types/customModules/generic.types';
 
 class Storage {
-    private updateFrequency = Variable(2000);
-    private shouldRound = false;
-    private storagePoller: FunctionPoller<GenericResourceData, []>;
+    private _updateFrequency = Variable(2000);
+    private _shouldRound = false;
+    private _storagePoller: FunctionPoller<GenericResourceData, []>;
 
     public storage = Variable<GenericResourceData>({ total: 0, used: 0, percentage: 0, free: 0 });
 
     constructor() {
         this.calculateUsage = this.calculateUsage.bind(this);
-        this.storagePoller = new FunctionPoller<GenericResourceData, []>(
+        this._storagePoller = new FunctionPoller<GenericResourceData, []>(
             this.storage,
             [],
-            bind(this.updateFrequency),
+            bind(this._updateFrequency),
             this.calculateUsage,
         );
 
-        this.storagePoller.initialize();
+        this._storagePoller.initialize();
     }
 
     public calculateUsage(): GenericResourceData {
@@ -39,7 +39,7 @@ class Storage {
                 total,
                 used,
                 free: available,
-                percentage: this.divide([total, used]),
+                percentage: this._divide([total, used]),
             };
         } catch (error) {
             console.error('Error calculating Storage usage:', error);
@@ -48,13 +48,13 @@ class Storage {
     }
 
     public setShouldRound(round: boolean): void {
-        this.shouldRound = round;
+        this._shouldRound = round;
     }
 
-    private divide([total, used]: number[]): number {
+    private _divide([total, used]: number[]): number {
         const percentageTotal = (used / total) * 100;
 
-        if (this.shouldRound) {
+        if (this._shouldRound) {
             return total > 0 ? Math.round(percentageTotal) : 0;
         }
 
@@ -62,15 +62,15 @@ class Storage {
     }
 
     public updateTimer(timerInMs: number): void {
-        this.updateFrequency.set(timerInMs);
+        this._updateFrequency.set(timerInMs);
     }
 
     public stopPoller(): void {
-        this.storagePoller.stop();
+        this._storagePoller.stop();
     }
 
     public startPoller(): void {
-        this.storagePoller.start();
+        this._storagePoller.start();
     }
 }
 
diff --git a/src/services/Wallpaper.ts b/src/services/Wallpaper.ts
index 16fd1da..27fcef6 100644
--- a/src/services/Wallpaper.ts
+++ b/src/services/Wallpaper.ts
@@ -59,19 +59,19 @@ class Wallpaper extends GObject.Object {
         }
     }
 
-    setWallpaper(path: string): void {
+    public setWallpaper(path: string): void {
         this.#setWallpaper(path);
     }
 
-    isRunning(): boolean {
+    public isRunning(): boolean {
         return this.#isRunning;
     }
 
     @property(String)
-    declare wallpaper: string;
+    declare public wallpaper: string;
 
     @signal(Boolean)
-    declare changed: (event: boolean) => void;
+    declare public changed: (event: boolean) => void;
 
     constructor() {
         super();
diff --git a/src/services/matugen/index.ts b/src/services/matugen/index.ts
index 18db9e0..2b04d3f 100644
--- a/src/services/matugen/index.ts
+++ b/src/services/matugen/index.ts
@@ -1,90 +1,116 @@
-import { defaultColorMap } from '../../lib/types/defaults/options';
-import { ColorMapValue, ColorMapKey, HexColor, MatugenColors } from '../../lib/types/options';
+import { ColorMapKey, HexColor, MatugenColors } from '../../lib/options/options.types';
 import { getMatugenVariations } from './variations';
 import { bash, dependencies, Notify, isAnImage } from '../../lib/utils';
 import options from '../../options';
 import icons from '../../lib/icons/icons';
-import Variable from 'astal/variable';
-const { scheme_type, contrast } = options.theme.matugen_settings;
-const { matugen } = options.theme;
+import { defaultColorMap } from 'src/lib/types/defaults/options.types';
 
-const updateOptColor = (color: HexColor, opt: Variable<HexColor>): void => {
-    opt.set(color);
-};
+const MATUGEN_ENABLED = options.theme.matugen;
+const MATUGEN_SETTINGS = options.theme.matugen_settings;
 
-export async function generateMatugenColors(): Promise<MatugenColors | undefined> {
-    if (!matugen.get() || !dependencies('matugen')) {
-        return;
+interface SystemDependencies {
+    checkDependencies(dep: string): boolean;
+    executeCommand(cmd: string): Promise<string>;
+    notify(notification: { summary: string; body: string; iconName: string }): void;
+    isValidImage(path: string): boolean;
+}
+
+class DefaultSystemDependencies implements SystemDependencies {
+    public checkDependencies(dep: string): boolean {
+        return dependencies(dep);
     }
-    const wallpaperPath = options.wallpaper.image.get();
 
-    try {
-        if (!wallpaperPath.length || !isAnImage(wallpaperPath)) {
-            Notify({
+    public async executeCommand(cmd: string): Promise<string> {
+        return bash(cmd);
+    }
+
+    public notify(notification: { summary: string; body: string; iconName: string }): void {
+        Notify(notification);
+    }
+
+    public isValidImage(path: string): boolean {
+        return isAnImage(path);
+    }
+}
+
+class MatugenService {
+    private _deps: SystemDependencies;
+
+    constructor(deps: SystemDependencies = new DefaultSystemDependencies()) {
+        this._deps = deps;
+    }
+
+    private _normalizeContrast(contrast: number): number {
+        return Math.max(-1, Math.min(1, contrast));
+    }
+
+    public async generateMatugenColors(): Promise<MatugenColors | undefined> {
+        if (!MATUGEN_ENABLED.get() || !this._deps.checkDependencies('matugen')) {
+            return;
+        }
+
+        const wallpaperPath = options.wallpaper.image.get();
+
+        if (!wallpaperPath || !this._deps.isValidImage(wallpaperPath)) {
+            this._deps.notify({
                 summary: 'Matugen Failed',
                 body: "Please select a wallpaper in 'Theming > General' first.",
                 iconName: icons.ui.warning,
             });
+
             return;
         }
 
-        const normalizedContrast = contrast.get() > 1 ? 1 : contrast.get() < -1 ? -1 : contrast.get();
-        const contents = await bash(
-            `matugen image --dry-run -q "${wallpaperPath}" -t scheme-${scheme_type.get()} --contrast ${normalizedContrast} --json hex`,
-        );
-        await bash(
-            `matugen image -q "${wallpaperPath}" -t scheme-${scheme_type.get()} --contrast ${normalizedContrast}`,
-        );
+        try {
+            const normalizedContrast = this._normalizeContrast(MATUGEN_SETTINGS.contrast.get());
+            const schemeType = MATUGEN_SETTINGS.scheme_type.get();
+            const mode = MATUGEN_SETTINGS.mode.get();
 
-        return JSON.parse(contents).colors[options.theme.matugen_settings.mode.get()];
-    } catch (error) {
-        const errMsg = `An error occurred while generating matugen colors: ${error}`;
-        console.error(errMsg);
-        return;
+            const baseCommand = `matugen image -q "${wallpaperPath}" -t scheme-${schemeType} --contrast ${normalizedContrast}`;
+
+            const jsonResult = await this._deps.executeCommand(`${baseCommand} --dry-run --json hex`);
+            await this._deps.executeCommand(baseCommand);
+
+            const parsedResult = JSON.parse(jsonResult);
+            return parsedResult?.colors?.[mode];
+        } catch (error) {
+            this._deps.notify({
+                summary: 'Matugen Error',
+                body: `An error occurred: ${error}`,
+                iconName: icons.ui.info,
+            });
+            console.error(`An error occurred while generating matugen colors: ${error}`);
+            return;
+        }
+    }
+
+    public isColorKeyValid(color: string): color is ColorMapKey {
+        return Object.prototype.hasOwnProperty.call(defaultColorMap, color);
+    }
+
+    public getMatugenHex(incomingHex: HexColor, matugenColors?: MatugenColors): HexColor {
+        if (!MATUGEN_ENABLED.get() || !matugenColors) {
+            return incomingHex;
+        }
+
+        const variation = MATUGEN_SETTINGS.variation.get();
+        const matugenVariation = getMatugenVariations(matugenColors, variation);
+
+        for (const colorKey of Object.keys(defaultColorMap)) {
+            if (!this.isColorKeyValid(colorKey)) {
+                continue;
+            }
+
+            const colorValue = defaultColorMap[colorKey];
+            if (colorValue === incomingHex) {
+                return matugenVariation[colorKey] ?? incomingHex;
+            }
+        }
+
+        return incomingHex;
     }
 }
 
-const isColorValid = (color: string): color is ColorMapKey => {
-    return defaultColorMap.hasOwnProperty(color);
-};
+const matugenService = new MatugenService();
 
-export const replaceHexValues = (incomingHex: HexColor, matugenColors: MatugenColors): HexColor => {
-    if (!options.theme.matugen.get()) {
-        return incomingHex;
-    }
-
-    const matugenVariation = getMatugenVariations(matugenColors, options.theme.matugen_settings.variation.get());
-    updateOptColor(matugenVariation.base, options.theme.bar.menus.menu.media.card.color as Variable<HexColor>);
-
-    for (const curColor of Object.keys(defaultColorMap)) {
-        const currentColor: string = curColor;
-        if (!isColorValid(currentColor)) {
-            continue;
-        }
-
-        const curColorValue: ColorMapValue = defaultColorMap[currentColor];
-        if (curColorValue === incomingHex) {
-            return matugenVariation[currentColor];
-        }
-    }
-
-    return incomingHex;
-};
-
-export const getMatugenHex = (incomingHex: HexColor, matugenColors: MatugenColors): HexColor => {
-    const matugenVariation = getMatugenVariations(matugenColors, options.theme.matugen_settings.variation.get());
-
-    for (const curColor of Object.keys(defaultColorMap)) {
-        if (!isColorValid(curColor)) {
-            continue;
-        }
-
-        const curColorValue: ColorMapValue = defaultColorMap[curColor];
-
-        if (curColorValue === incomingHex) {
-            return matugenVariation[curColor];
-        }
-    }
-
-    return incomingHex;
-};
+export { matugenService };
diff --git a/src/services/matugen/variations.ts b/src/services/matugen/variations.ts
index 46f8e9b..fa427ad 100644
--- a/src/services/matugen/variations.ts
+++ b/src/services/matugen/variations.ts
@@ -1,11 +1,14 @@
-import { MatugenColors, MatugenVariation, MatugenVariations } from 'src/lib/types/options';
+import { MatugenColors, MatugenVariations, MatugenVariation } from 'src/lib/options/options.types';
 
 /*
  * NOTE: This maps the values of the default colors to the values generated by Matugen.
  * Each of the variations are carefully tested and curated to make sure that colors don't
  * have weird luminocity overlaps (light on light, dark on dark).
  */
-export const getMatugenVariations = (matugenColors: MatugenColors, variation: MatugenVariations): MatugenVariation => {
+export const getMatugenVariations = (
+    matugenColors: MatugenColors,
+    variation: MatugenVariations,
+): MatugenVariation => {
     const matVtns = {
         standard_1: {
             rosewater: matugenColors.secondary,
@@ -566,5 +569,6 @@ export const getMatugenVariations = (matugenColors: MatugenColors, variation: Ma
             crust3: matugenColors.surface_dim,
         },
     };
+
     return matVtns[variation];
 };
diff --git a/src/globals/dropdown.ts b/src/shared/dropdown.ts
similarity index 100%
rename from src/globals/dropdown.ts
rename to src/shared/dropdown.ts
diff --git a/src/globals/media.ts b/src/shared/media.ts
similarity index 94%
rename from src/globals/media.ts
rename to src/shared/media.ts
index 54bcd59..6392154 100644
--- a/src/globals/media.ts
+++ b/src/shared/media.ts
@@ -11,12 +11,17 @@ export const activePlayer = Variable<AstalMpris.Player | undefined>(undefined);
 const forceUpdate = Variable(false);
 
 mprisService.connect('player-closed', (_, closedPlayer) => {
-    if (mprisService.get_players().length === 1 && closedPlayer.busName === mprisService.get_players()[0]?.busName) {
+    if (
+        mprisService.get_players().length === 1 &&
+        closedPlayer.busName === mprisService.get_players()[0]?.busName
+    ) {
         return activePlayer.set(undefined);
     }
 
     if (closedPlayer.busName === activePlayer.get()?.busName) {
-        const nextPlayer = mprisService.get_players().find((player) => player.busName !== closedPlayer.busName);
+        const nextPlayer = mprisService
+            .get_players()
+            .find((player) => player.busName !== closedPlayer.busName);
         activePlayer.set(nextPlayer);
     }
 });
@@ -200,9 +205,12 @@ const updateCanGoPrevious = (player: AstalMpris.Player | undefined): void => {
 
     const canGoPreviousBinding = bind(player, 'canGoPrevious');
 
-    canGoPreviousUnsub = Variable.derive([canGoPreviousBinding, bind(player, 'playbackStatus')], (canPrev) => {
-        canGoPrevious.set(canPrev ?? false);
-    });
+    canGoPreviousUnsub = Variable.derive(
+        [canGoPreviousBinding, bind(player, 'playbackStatus')],
+        (canPrev) => {
+            canGoPrevious.set(canPrev ?? false);
+        },
+    );
 
     const initialCanPrev = canGoPrevious.get();
     canGoPrevious.set(initialCanPrev);
diff --git a/src/globals/notification.ts b/src/shared/notification.ts
similarity index 74%
rename from src/globals/notification.ts
rename to src/shared/notification.ts
index afcd38d..62dc9ec 100644
--- a/src/globals/notification.ts
+++ b/src/shared/notification.ts
@@ -13,7 +13,11 @@ export const getNotificationIcon = (app_name: string, app_icon: string, app_entr
     let icon: string = icons.fallback.notification;
 
     if (lookUpIcon(app_name) || lookUpIcon(app_name.toLowerCase() || '')) {
-        icon = lookUpIcon(app_name) ? app_name : lookUpIcon(app_name.toLowerCase()) ? app_name.toLowerCase() : '';
+        icon = lookUpIcon(app_name)
+            ? app_name
+            : lookUpIcon(app_name.toLowerCase())
+              ? app_name.toLowerCase()
+              : '';
     }
 
     if (lookUpIcon(app_icon) && icon === '') {
@@ -27,7 +31,10 @@ export const getNotificationIcon = (app_name: string, app_icon: string, app_entr
     return icon;
 };
 
-export const clearNotifications = async (notifications: AstalNotifd.Notification[], delay: number): Promise<void> => {
+export const clearNotifications = async (
+    notifications: AstalNotifd.Notification[],
+    delay: number,
+): Promise<void> => {
     removingNotifications.set(true);
     for (const notification of notifications) {
         notification.dismiss();
@@ -36,13 +43,10 @@ export const clearNotifications = async (notifications: AstalNotifd.Notification
     removingNotifications.set(false);
 };
 
-const clearAllNotifications = async (): Promise<void> => {
+export async function clearAllNotifications(): Promise<void> {
     try {
         clearNotifications(notifdService.get_notifications(), clearDelay.get());
     } catch (error) {
         errorHandler(error);
     }
-};
-
-globalThis['removingNotifications'] = removingNotifications;
-globalThis['clearAllNotifications'] = clearAllNotifications;
+}
diff --git a/src/globals/systray.ts b/src/shared/systray.ts
similarity index 82%
rename from src/globals/systray.ts
rename to src/shared/systray.ts
index c9dbe43..69a2323 100644
--- a/src/globals/systray.ts
+++ b/src/shared/systray.ts
@@ -2,7 +2,7 @@ import AstalTray from 'gi://AstalTray';
 import { errorHandler } from 'src/lib/utils';
 const systemtray = AstalTray.get_default();
 
-globalThis.getSystrayItems = (): string => {
+export function getSystrayItems(): string {
     try {
         const items = systemtray
             .get_items()
@@ -13,6 +13,4 @@ globalThis.getSystrayItems = (): string => {
     } catch (error) {
         errorHandler(error);
     }
-};
-
-export { getSystrayItems };
+}
diff --git a/src/globals/time.ts b/src/shared/time.ts
similarity index 100%
rename from src/globals/time.ts
rename to src/shared/time.ts
diff --git a/src/globals/useTheme.ts b/src/shared/useTheme.ts
similarity index 84%
rename from src/globals/useTheme.ts
rename to src/shared/useTheme.ts
index e84ed99..e2791a0 100644
--- a/src/globals/useTheme.ts
+++ b/src/shared/useTheme.ts
@@ -1,12 +1,16 @@
 import options from '../options';
 import Gio from 'gi://Gio';
 import { bash, errorHandler } from '../lib/utils';
-import { filterConfigForThemeOnly, loadJsonFile, saveConfigToFile } from '../components/settings/shared/FileChooser';
+import {
+    filterConfigForThemeOnly,
+    loadJsonFile,
+    saveConfigToFile,
+} from '../components/settings/shared/FileChooser';
 
 const { restartCommand } = options.hyprpanel;
 export const hexColorPattern = /^#([0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/;
 
-globalThis.useTheme = (filePath: string): void => {
+export function useTheme(filePath: string): void {
     try {
         const importedConfig = loadJsonFile(filePath);
 
@@ -32,4 +36,4 @@ globalThis.useTheme = (filePath: string): void => {
     } catch (error) {
         errorHandler(error);
     }
-};
+}
diff --git a/src/globals/utilities.ts b/src/shared/utilities.ts
similarity index 69%
rename from src/globals/utilities.ts
rename to src/shared/utilities.ts
index f5e80ea..00aa6b2 100644
--- a/src/globals/utilities.ts
+++ b/src/shared/utilities.ts
@@ -1,9 +1,9 @@
 import { App } from 'astal/gtk3';
 import options from '../options';
-import { BarLayouts } from 'src/lib/types/options';
 import { Variable } from 'astal';
+import { BarLayouts } from 'src/lib/options/options.types';
 
-globalThis.isWindowVisible = (windowName: string): boolean => {
+export function isWindowVisible(windowName: string): boolean {
     const appWindow = App.get_window(windowName);
 
     if (appWindow === undefined || appWindow === null) {
@@ -11,9 +11,9 @@ globalThis.isWindowVisible = (windowName: string): boolean => {
     }
 
     return appWindow.visible;
-};
+}
 
-globalThis.setLayout = (layout: BarLayouts): string => {
+export function setLayout(layout: BarLayouts): string {
     try {
         const { layouts } = options.bar;
 
@@ -22,6 +22,6 @@ globalThis.setLayout = (layout: BarLayouts): string => {
     } catch (error) {
         return `Failed to set layout: ${error}`;
     }
-};
+}
 
-globalThis.idleInhibit = Variable(false);
+export const idleInhibit = Variable(false);
diff --git a/src/globals/variables.ts b/src/shared/variables.ts
similarity index 89%
rename from src/globals/variables.ts
rename to src/shared/variables.ts
index 68bf304..804b5ff 100644
--- a/src/globals/variables.ts
+++ b/src/shared/variables.ts
@@ -1,5 +1,5 @@
-import { Opt } from '../lib/option';
-import { HexColor, MatugenTheme, RecursiveOptionsObject } from 'src/lib/types/options';
+import { Opt } from 'src/lib/options';
+import { RecursiveOptionsObject, HexColor, MatugenTheme } from 'src/lib/options/options.types';
 
 export const isOpt = <T>(value: unknown): value is Opt<T> =>
     typeof value === 'object' && value !== null && 'value' in value && value instanceof Opt;
diff --git a/src/globals/wallpaper.ts b/src/shared/wallpaper.ts
similarity index 92%
rename from src/globals/wallpaper.ts
rename to src/shared/wallpaper.ts
index f1c78ee..ac54cdd 100644
--- a/src/globals/wallpaper.ts
+++ b/src/shared/wallpaper.ts
@@ -5,7 +5,7 @@ import Wallpaper from 'src/services/Wallpaper';
 const { EXISTS, IS_REGULAR } = GLib.FileTest;
 const { enable: enableWallpaper, image } = options.wallpaper;
 
-globalThis.setWallpaper = (filePath: string): void => {
+export function setWallpaper(filePath: string): void {
     if (!(GLib.file_test(filePath, EXISTS) && GLib.file_test(filePath, IS_REGULAR))) {
         throw new Error('The input file is not a valid wallpaper.');
     }
@@ -24,4 +24,4 @@ globalThis.setWallpaper = (filePath: string): void => {
             throw new Error(`An error occurred while setting the wallpaper: ${error}`);
         }
     }
-};
+}
diff --git a/src/globals/weather.ts b/src/shared/weather.ts
similarity index 92%
rename from src/globals/weather.ts
rename to src/shared/weather.ts
index 239a92f..98312c9 100644
--- a/src/globals/weather.ts
+++ b/src/shared/weather.ts
@@ -1,9 +1,9 @@
 import options from 'src/options';
-import { UnitType, Weather, WeatherIconTitle, WeatherIcon } from 'src/lib/types/weather.js';
-import { DEFAULT_WEATHER } from 'src/lib/types/defaults/weather.js';
 import GLib from 'gi://GLib?version=2.0';
 import { weatherIcons } from 'src/lib/icons/weather.js';
 import { AstalIO, bind, execAsync, interval, Variable } from 'astal';
+import { DEFAULT_WEATHER } from 'src/lib/types/defaults/weather.types';
+import { Weather, UnitType, WeatherIconTitle, WeatherIcon } from 'src/lib/types/weather.types';
 
 const { EXISTS, IS_REGULAR } = GLib.FileTest;
 
@@ -100,12 +100,15 @@ const weatherIntervalFn = (weatherInterval: number, loc: string, weatherKey: str
     });
 };
 
-Variable.derive([bind(weatherApiKey), bind(weatherInterval), bind(location)], (weatherKey, weatherInterval, loc) => {
-    if (!weatherKey) {
-        return globalWeatherVar.set(DEFAULT_WEATHER);
-    }
-    weatherIntervalFn(weatherInterval, loc, weatherKey);
-})();
+Variable.derive(
+    [bind(weatherApiKey), bind(weatherInterval), bind(location)],
+    (weatherKey, weatherInterval, loc) => {
+        if (!weatherKey) {
+            return globalWeatherVar.set(DEFAULT_WEATHER);
+        }
+        weatherIntervalFn(weatherInterval, loc, weatherKey);
+    },
+)();
 
 /**
  * Gets the temperature from the weather data in the specified unit.
@@ -147,7 +150,9 @@ export const getWeatherIcon = (fahrenheit: number): Record<string, string> => {
     type IconKeys = keyof typeof icons;
 
     const threshold: IconKeys =
-        fahrenheit < 0 ? 0 : ([100, 75, 50, 25, 0] as IconKeys[]).find((threshold) => threshold <= fahrenheit) || 0;
+        fahrenheit < 0
+            ? 0
+            : (([100, 75, 50, 25, 0] as IconKeys[]).find((threshold) => threshold <= fahrenheit) ?? 0);
 
     const icon = icons[threshold || 50];
     const color = colors[threshold || 50];
@@ -216,5 +221,3 @@ export const getWeatherStatusTextIcon = (weatherData: Weather): WeatherIcon => {
 export const convertCelsiusToFahrenheit = (celsiusValue: number): number => {
     return (celsiusValue * 9) / 5 + 32;
 };
-
-globalThis['globalWeatherVar'] = globalWeatherVar;
diff --git a/src/globals/window.ts b/src/shared/window.ts
similarity index 100%
rename from src/globals/window.ts
rename to src/shared/window.ts
diff --git a/tsconfig.json b/tsconfig.json
index 1e11809..3e4b627 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,7 +6,7 @@
         "module": "ES2022",
         "lib": ["ES2022", "DOM"],
         "moduleResolution": "Bundler",
-        "allowJs": true,
+        "allowJs": false,
         "checkJs": false,
         "strict": true,
         "noImplicitAny": true,
@@ -14,7 +14,6 @@
         "alwaysStrict": true,
         "noImplicitThis": true,
         "baseUrl": ".",
-        "typeRoots": ["src/lib/types"],
         "skipLibCheck": true,
         "types": [],
         "experimentalDecorators": true,