diff --git a/frontend/src/components/lib/JSplashscreen.vue b/frontend/src/components/Layout/Splashscreen.vue
similarity index 100%
rename from frontend/src/components/lib/JSplashscreen.vue
rename to frontend/src/components/Layout/Splashscreen.vue
diff --git a/frontend/src/components/lib/JView.vue b/frontend/src/components/lib/JView.vue
index 6b8fa06d42a..43115e316aa 100644
--- a/frontend/src/components/lib/JView.vue
+++ b/frontend/src/components/lib/JView.vue
@@ -21,7 +21,7 @@
       <template
         v-if="!apploaded && root"
         #fallback>
-        <JSplashscreen />
+        <Splashscreen />
       </template>
     </Suspense>
   </JTransition>
diff --git a/frontend/src/store/index.ts b/frontend/src/store/index.ts
index 26dab7f14cd..3a866ba26ff 100644
--- a/frontend/src/store/index.ts
+++ b/frontend/src/store/index.ts
@@ -15,12 +15,6 @@ import { remote } from '#/plugins/remote';
 import { router } from '#/plugins/router';
 import type { SubtitleTypographyChoices } from '#/store/client-settings/subtitle-settings';
 
-/**
- * This file contains global variables (specially VueUse refs) that are used multiple times across the client.
- * VueUse composables will set new event handlers, so it's more
- * efficient to reuse those, both in components and TS files.
- */
-
 export const DEFAULT_TYPOGRAPHY = 'Figtree Variable';
 /**
  * Type for the different typography choices across the application
diff --git a/frontend/src/utils/i18n.ts b/frontend/src/utils/i18n.ts
index facc9336990..9d48749d189 100644
--- a/frontend/src/utils/i18n.ts
+++ b/frontend/src/utils/i18n.ts
@@ -1,3 +1,4 @@
+import { isStr } from '@jellyfin-vue/shared/validation';
 import { upperFirst } from '#/utils/data-manipulation';
 
 /**
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 0dbe5dc3b62..6d3e6cb0abd 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "extends": "@jellyfin-vue/configs/typescript",
   "compilerOptions": {
+    "baseUrl": ".",
     "lib": [
       "ESNext",
       "DOM",
diff --git a/frontend/types/global/components.d.ts b/frontend/types/global/components.d.ts
index ff958ecc60c..84f56ff0bd2 100644
--- a/frontend/types/global/components.d.ts
+++ b/frontend/types/global/components.d.ts
@@ -98,15 +98,15 @@ declare module 'vue' {
     ItemsCarousel: typeof import('./../../src/components/Layout/Carousel/Item/ItemsCarousel.vue')['default']
     ItemsCarouselTitle: typeof import('./../../src/components/Layout/Carousel/Item/ItemsCarouselTitle.vue')['default']
     JApp: typeof import('./../../src/components/lib/JApp.vue')['default']
-    JHover: typeof import('./../../src/components/lib/JHover.vue')['default']
+    JHover: typeof import('@jellyfin-vue/ui-toolkit/components')['JHover']
     JImg: typeof import('./../../src/components/lib/JImg.vue')['default']
     JOverlay: typeof import('./../../src/components/lib/JOverlay.vue')['default']
     JSafeHtml: typeof import('./../../src/components/lib/JSafeHtml.vue')['default']
-    JSlot: typeof import('./../../src/components/lib/JSlot.vue')['default']
+    JSlot: typeof import('@jellyfin-vue/ui-toolkit/components')['JSlot']
     JSplashscreen: typeof import('./../../src/components/lib/JSplashscreen.vue')['default']
     JTransition: typeof import('./../../src/components/lib/JTransition.vue')['default']
     JView: typeof import('./../../src/components/lib/JView.vue')['default']
-    JVirtual: typeof import('./../../src/components/lib/JVirtual/JVirtual.vue')['default']
+    JVirtual: typeof import('@jellyfin-vue/ui-toolkit/components')['JVirtual']
     LikeButton: typeof import('./../../src/components/Buttons/LikeButton.vue')['default']
     LoadingIndicator: typeof import('./../../src/components/System/LoadingIndicator.vue')['default']
     LocaleSwitcher: typeof import('./../../src/components/System/LocaleSwitcher.vue')['default']
diff --git a/package-lock.json b/package-lock.json
index 4d25254b6e6..96f85231c72 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13107,9 +13107,15 @@
     },
     "packages/ui-toolkit": {
       "name": "@jellyfin-vue/ui-toolkit",
+      "dependencies": {
+        "@skirtle/vue-vnode-utils": "0.2.0",
+        "@vueuse/core": "12.3.0",
+        "comlink": "4.4.2",
+        "vue": "3.5.13"
+      },
       "devDependencies": {
         "@jellyfin-vue/configs": "*",
-        "unplugin-vue-components": "0.28.0"
+        "unplugin-vue-components": "28.0.0"
       }
     },
     "packages/vite-plugins": {
diff --git a/packages/ui-toolkit/package.json b/packages/ui-toolkit/package.json
index 860b7cfc56d..71e351301f4 100644
--- a/packages/ui-toolkit/package.json
+++ b/packages/ui-toolkit/package.json
@@ -2,8 +2,13 @@
   "name": "@jellyfin-vue/ui-toolkit",
   "type": "module",
   "description": "Base components and UI toolkit for Jellyfin Vue",
+  "imports": {
+    "#/*": "./src/*"
+  },
   "exports": {
-    "./components": "./src/components"
+    "./components": "./src/components/index.ts",
+    "./store": "./src/store.ts",
+    "./resolver": "./src/resolver.ts"
   },
   "scripts": {
     "lint": "eslint . --flag unstable_ts_config",
@@ -13,6 +18,12 @@
   },
   "devDependencies": {
     "@jellyfin-vue/configs": "*",
-    "unplugin-vue-components": "0.28.0"
+    "unplugin-vue-components": "28.0.0"
+  },
+  "dependencies": {
+    "@skirtle/vue-vnode-utils": "0.2.0",
+    "@vueuse/core": "12.3.0",
+    "comlink": "4.4.2",
+    "vue": "3.5.13"
   }
 }
diff --git a/frontend/src/components/lib/JHover.vue b/packages/ui-toolkit/src/components/JHover.vue
similarity index 100%
rename from frontend/src/components/lib/JHover.vue
rename to packages/ui-toolkit/src/components/JHover.vue
diff --git a/frontend/src/components/lib/JOverlay.vue b/packages/ui-toolkit/src/components/JOverlay.vue
similarity index 100%
rename from frontend/src/components/lib/JOverlay.vue
rename to packages/ui-toolkit/src/components/JOverlay.vue
diff --git a/frontend/src/components/lib/JSlot.vue b/packages/ui-toolkit/src/components/JSlot.vue
similarity index 100%
rename from frontend/src/components/lib/JSlot.vue
rename to packages/ui-toolkit/src/components/JSlot.vue
diff --git a/frontend/src/components/lib/JVirtual/JVirtual.vue b/packages/ui-toolkit/src/components/JVirtual/index.vue
similarity index 98%
rename from frontend/src/components/lib/JVirtual/JVirtual.vue
rename to packages/ui-toolkit/src/components/JVirtual/index.vue
index aec1405c32d..6fc1811ec19 100644
--- a/frontend/src/components/lib/JVirtual/JVirtual.vue
+++ b/packages/ui-toolkit/src/components/JVirtual/index.vue
@@ -53,14 +53,14 @@ import {
 } from './pipeline';
 import type { IJVirtualWorker } from './j-virtual.worker';
 import JVirtualWorker from './j-virtual.worker?worker';
-import { vuetify } from '#/plugins/vuetify';
+import { windowSize } from '#/store.ts';
 
 /**
  * SHARED STATE ACROSS ALL THE COMPONENT INSTANCES
  */
-const display = vuetify.display;
-const displayWidth = refDebounced(display.width, 250);
-const displayHeight = refDebounced(display.height, 250);
+
+const displayWidth = refDebounced(windowSize.width, 250);
+const displayHeight = refDebounced(windowSize.height, 250);
 </script>
 
 <script setup lang="ts" generic="T">
diff --git a/frontend/src/components/lib/JVirtual/j-virtual.worker.ts b/packages/ui-toolkit/src/components/JVirtual/j-virtual.worker.ts
similarity index 100%
rename from frontend/src/components/lib/JVirtual/j-virtual.worker.ts
rename to packages/ui-toolkit/src/components/JVirtual/j-virtual.worker.ts
diff --git a/frontend/src/components/lib/JVirtual/pipeline.ts b/packages/ui-toolkit/src/components/JVirtual/pipeline.ts
similarity index 100%
rename from frontend/src/components/lib/JVirtual/pipeline.ts
rename to packages/ui-toolkit/src/components/JVirtual/pipeline.ts
diff --git a/packages/ui-toolkit/src/components/index.ts b/packages/ui-toolkit/src/components/index.ts
new file mode 100644
index 00000000000..7ed71133436
--- /dev/null
+++ b/packages/ui-toolkit/src/components/index.ts
@@ -0,0 +1,5 @@
+export { default as JVirtual } from './JVirtual/index.vue';
+
+export { default as JHover } from './JHover.vue';
+export { default as JOverlay } from './JVirtual/index.vue';
+export { default as JSlot } from './JSlot.vue';
diff --git a/packages/ui-toolkit/src/store.ts b/packages/ui-toolkit/src/store.ts
new file mode 100644
index 00000000000..0e23f2416aa
--- /dev/null
+++ b/packages/ui-toolkit/src/store.ts
@@ -0,0 +1,9 @@
+/**
+ * This module contains application-level state (specially VueUse refs)
+ * that are used multiple times across the client. VueUse composables will set
+ * new event handlers/effects, so it's more efficient to reuse those,
+ * both in components and TS files.
+ */
+import { useWindowSize } from '@vueuse/core';
+
+export const windowSize = useWindowSize();
diff --git a/packages/vite-plugins/tsconfig.json b/packages/vite-plugins/tsconfig.json
index 1b480fe9797..431e6b932de 100644
--- a/packages/vite-plugins/tsconfig.json
+++ b/packages/vite-plugins/tsconfig.json
@@ -1,5 +1,8 @@
 {
   "extends": "@jellyfin-vue/configs/typescript",
+  "compilerOptions": {
+    "baseUrl": "."
+  },
   "exclude": [
     "dist",
     "node_modules",