Pkg upgrades

components/apps/Terminal/python.ts

@@ -21,7 +21,7 @@ declare global {
 
 const config = {
   fullStdLib: false,
-  indexURL: "/Program Files/Xterm.js/Pyodide/",
+  indexURL: "/Program Files/Pyodide/",
 };
 
 const versionCommand = "import sys\r\nsys.version\r\n";
@@ -33,7 +33,7 @@ export const runPython = async (
   code: string,
   printLn: (message: string) => void
 ): Promise<void> => {
-  await loadFiles(["/Program Files/Xterm.js/Pyodide/pyodide.js"]);
+  await loadFiles(["/Program Files/Pyodide/pyodide.js"]);
 
   if (!window.pyodide && window.loadPyodide) {
     window.pyodide = await window.loadPyodide(config);

components/system/Desktop/Wallpapers/useWallpaper.ts

@@ -507,6 +507,7 @@ const useWallpaper = (
     if (sessionLoaded) {
       if (wallpaperTimerRef.current) {
         window.clearTimeout(wallpaperTimerRef.current);
+        wallpaperTimerRef.current = 0;
       }
 
       if (wallpaperName && !WALLPAPER_WORKER_NAMES.includes(wallpaperName)) {

components/system/Files/FileManager/useDraggableEntries.ts

@@ -173,8 +173,8 @@ const useDraggableEntries = (
           event.nativeEvent.dataTransfer?.setData(
             "DownloadURL",
             `${getMimeType(file) || "application/octet-stream"}:${file}:${
-              window.location.href
-            }${join(entryUrl, file)}`
+              window.location.origin
+            }${encodeURI(join(entryUrl, file))}`
           );
         }
 

components/system/StartMenu/Sidebar/StyledSidebar.ts

@@ -14,7 +14,6 @@ const StyledSidebar = styled.nav`
   z-index: 1;
 
   &:hover:not(&.collapsed) {
-    backdrop-filter: ${({ theme }) => `blur(${theme.sizes.taskbar.panelBlur})`};
     background-color: hsl(0 0% 10% / 95%);
     box-shadow: 8px 0 5px -5px hsl(0 0% 10% / 50%);
     transition:
@@ -26,6 +25,18 @@ const StyledSidebar = styled.nav`
     @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
       background-color: hsl(0 0% 10% / 75%);
     }
+
+    &::before {
+      backdrop-filter: ${({ theme }) =>
+        `blur(${theme.sizes.taskbar.panelBlur})`};
+      background-color: hsl(0 0% 10% / 50%);
+      content: "";
+      height: 100%;
+      margin-top: -4px;
+      position: absolute;
+      width: 100%;
+      z-index: -100000;
+    }
   }
 
   &.collapsed {

components/system/StartMenu/Sidebar/index.tsx

@@ -42,7 +42,10 @@ const Sidebar: FC<SidebarProps> = ({ height }) => {
   const expandTimer = useRef(0);
   const sidebarRef = useRef<HTMLElement>(null);
   const clearTimer = (): void => {
-    if (expandTimer.current) clearTimeout(expandTimer.current);
+    if (expandTimer.current) {
+      clearTimeout(expandTimer.current);
+      expandTimer.current = 0;
+    }
   };
   const topButtons: SidebarButtons = useMemo(
     () => [

components/system/StartMenu/StyledStartMenu.ts

@@ -17,6 +17,8 @@ const StyledStartMenu = styled(motion.nav)<StyledStartMenuProps>`
   ${({ theme }) =>
     TaskbarPanel(theme.sizes.startMenu.maxHeight, theme.sizes.startMenu.size)}
 
+  backdrop-filter: ${({ theme }) => `blur(${theme.sizes.taskbar.panelBlur})`};
+
   ${StyledFileManager} {
     ${ScrollBars(THIN_SCROLLBAR_WIDTH, -2, -1)};
     margin-top: 0;

components/system/StartMenu/index.tsx

@@ -5,7 +5,6 @@ import FileManager from "components/system/Files/FileManager";
 import Sidebar from "components/system/StartMenu/Sidebar";
 import StyledStartMenu from "components/system/StartMenu/StyledStartMenu";
 import { updateInputValueOnReactElement } from "components/system/Taskbar/Search/functions";
-import StyledBackground from "components/system/Taskbar/StyledBackground";
 import {
   SEARCH_BUTTON_TITLE,
   START_BUTTON_TITLE,
@@ -105,7 +104,6 @@ const StartMenu: FC<StartMenuProps> = ({ toggleStartMenu }) => {
       {...startMenuTransition}
       {...FOCUSABLE_ELEMENT}
     >
-      <StyledBackground $height={height} />
       <Sidebar height={height} />
       <FileManager
         url={START_MENU_PATH}

components/system/Taskbar/StyledBackground.ts

@@ -1,16 +0,0 @@
-import styled from "styled-components";
-
-type StyledBackgroundProps = {
-  $height?: string;
-};
-
-const StyledBackground = styled.span<StyledBackgroundProps>`
-  backdrop-filter: ${({ theme }) => `blur(${theme.sizes.taskbar.panelBlur})`};
-  height: ${({ $height }) => $height};
-  inset: 0;
-  position: absolute;
-  width: 100%;
-  z-index: -1;
-`;
-
-export default StyledBackground;

components/system/Taskbar/StyledTaskbar.ts

@@ -1,8 +1,9 @@
 import styled from "styled-components";
 import { TASKBAR_HEIGHT } from "utils/constants";
 
+const TASKBAR_Z_INDEX = 100000;
+
 const StyledTaskbar = styled.nav`
-  backdrop-filter: ${({ theme }) => `blur(${theme.sizes.taskbar.blur})`};
   background-color: ${({ theme }) => theme.colors.taskbar.background};
   bottom: 0;
   contain: size layout;
@@ -11,7 +12,17 @@ const StyledTaskbar = styled.nav`
   position: absolute;
   right: 0;
   width: 100vw;
-  z-index: 100000;
+  z-index: ${TASKBAR_Z_INDEX};
+
+  &::after {
+    backdrop-filter: ${({ theme }) => `blur(${theme.sizes.taskbar.blur})`};
+    content: "";
+    display: block;
+    height: 100%;
+    position: relative;
+    width: 100%;
+    z-index: -${TASKBAR_Z_INDEX};
+  }
 `;
 
 export default StyledTaskbar;

components/system/Taskbar/TaskbarEntry/Peek/StyledPeekWindow.ts

@@ -22,7 +22,7 @@ const StyledPeekWindow = styled(motion.div)<StyledPeekWindowProps>`
     $offsetX ? `translateX(${$offsetX}px)` : undefined};
 
   ${StyledTaskbarEntry}:hover & {
-    background-color: hsl(0 0% 25% / 85%);
+    background-color: hsl(0 0% 25% / 70%);
 
     &:active {
       background-color: ${({ theme }) => theme.colors.taskbar.activeForeground};

components/system/Taskbar/TaskbarEntry/index.tsx

@@ -1,4 +1,4 @@
-import { memo, useCallback, useMemo, useState } from "react";
+import { memo, useCallback, useMemo, useRef, useState } from "react";
 import dynamic from "next/dynamic";
 import { AnimatePresence } from "motion/react";
 import StyledTaskbarEntry from "components/system/Taskbar/TaskbarEntry/StyledTaskbarEntry";
@@ -40,8 +40,20 @@ const TaskbarEntry: FC<TaskbarEntryProps> = ({ icon, id, title }) => {
     [id, linkElement]
   );
   const [isPeekVisible, setIsPeekVisible] = useState(false);
-  const hidePeek = useCallback((): void => setIsPeekVisible(false), []);
-  const showPeek = useCallback((): void => setIsPeekVisible(true), []);
+  const hidePeekTimerRef = useRef(0);
+  const hidePeek = useCallback((): void => {
+    hidePeekTimerRef.current = window.setTimeout(
+      () => setIsPeekVisible(false),
+      200
+    );
+  }, []);
+  const showPeek = useCallback((): void => {
+    if (hidePeekTimerRef.current) {
+      window.clearTimeout(hidePeekTimerRef.current);
+      hidePeekTimerRef.current = 0;
+    }
+    setIsPeekVisible(true);
+  }, []);
   const onClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(
     (event): void => {
       if (event.shiftKey && !singleton) {

contexts/menu/useMenuContextState.ts

@@ -100,10 +100,12 @@ const useMenuContextState = (): MenuContextState => {
               touchEvent.current = undefined;
             }
             window.clearTimeout(touchTimer.current);
+            touchTimer.current = 0;
           },
           onTouchMove: () => {
             touchEvent.current = undefined;
             window.clearTimeout(touchTimer.current);
+            touchTimer.current = 0;
           },
           onTouchStart: (event: React.TouchEvent) => {
             event.preventDefault();

package.json

@@ -61,11 +61,11 @@
     "idb": "^8.0.3",
     "ini": "^5.0.0",
     "isomorphic-git": "^1.30.2",
-    "libheif-js": "^1.18.2",
+    "libheif-js": "^1.19.8",
     "mediainfo.js": "0.3.5",
     "minimist": "^1.2.8",
-    "motion": "^12.16.0",
-    "multiformats": "^13.3.6",
+    "motion": "^12.18.1",
+    "multiformats": "^13.3.7",
     "music-metadata-browser": "^2.5.11",
     "next": "^15.3.3",
     "nostr-tools": "^1.17.0",
@@ -79,7 +79,7 @@
     "react-rnd": "^10.5.2",
     "resedit": "^2.0.3",
     "rtf.js": "^3.0.9",
-    "styled-components": "^6.1.18",
+    "styled-components": "^6.1.19",
     "utif": "https://github.com/photopea/UTIF.js",
     "wasi-js": "^1.7.3"
   },
@@ -88,7 +88,7 @@
     "@axe-core/playwright": "^4.10.2",
     "@next/bundle-analyzer": "^15.3.3",
     "@next/eslint-plugin-next": "^15.3.3",
-    "@playwright/test": "^1.52.0",
+    "@playwright/test": "^1.53.0",
     "@types/canvas-confetti": "^1.9.0",
     "@types/dom-chromium-ai": "0.0.6",
     "@types/dompurify": "^3.2.0",
@@ -97,16 +97,16 @@
     "@types/jest": "^29.5.14",
     "@types/lunr": "^2.3.7",
     "@types/minimist": "^1.2.5",
-    "@types/node": "^22.15.30",
+    "@types/node": "^24.0.1",
     "@types/offscreencanvas": "^2019.7.3",
     "@types/opentype.js": "^1.3.8",
-    "@types/react": "^19.1.6",
+    "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "@types/ua-parser-js": "^0.7.39",
     "@types/video.js": "^7.3.58",
     "@types/wicg-file-system-access": "^2023.10.6",
-    "@typescript-eslint/eslint-plugin": "^8.33.1",
-    "@typescript-eslint/parser": "^8.33.1",
+    "@typescript-eslint/eslint-plugin": "^8.34.0",
+    "@typescript-eslint/parser": "^8.34.0",
     "emulators": "^8.3.9",
     "emulators-ui": "^0.73.9",
     "eruda": "^3.4.1",
@@ -116,7 +116,7 @@
     "eslint-config-prettier": "^10.1.5",
     "eslint-plugin-deprecation": "^3.0.0",
     "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-jest": "^28.13.0",
+    "eslint-plugin-jest": "^28.13.5",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-no-relative-import-paths": "^1.6.1",
     "eslint-plugin-playwright": "^2.2.0",
@@ -133,21 +133,21 @@
     "html-minifier-terser": "^7.2.0",
     "html-to-image": "^1.11.13",
     "husky": "^9.1.7",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^30.0.0-beta.3",
-    "lint-staged": "^16.1.0",
+    "jest": "^30.0.0",
+    "jest-environment-jsdom": "^30.0.0",
+    "lint-staged": "^16.1.1",
     "lunr": "^2.3.9",
     "monaco-editor": "^0.52.2",
     "pdfjs-dist": "^5.3.31",
-    "playwright-core": "^1.52.0",
-    "postcss": "^8.5.4",
+    "playwright-core": "^1.53.0",
+    "postcss": "^8.5.5",
     "postcss-styled-syntax": "^0.7.1",
     "postcss-syntax": "^0.36.2",
     "serve": "^14.2.4",
     "stylelint": "^16.20.0",
     "stylelint-config-standard": "^38.0.0",
     "stylelint-order": "^7.0.0",
-    "terser": "^5.41.0",
+    "terser": "^5.42.0",
     "tinymce": "^7.9.1",
     "ts-prune": "^0.10.3",
     "typescript": "^5.8.3",

utils/functions.ts

@@ -1220,7 +1220,7 @@ export const maybeRequestIdleCallback = (
   ) {
     requestIdleCallback(callback);
   } else {
-    callback();
+    setTimeout(callback, 0);
   }
 };