react-os-shell 0.4.0 → 0.5.0

package/dist/index.js

@@ -6,21 +6,21 @@ export { setShellMailServer, useMailAuth } from './chunk-VBFB3ZIN.js';
 import { subscribePomo, getPomoSnapshot } from './chunk-MK3HLUO4.js';
 import { useShellPrefs } from './chunk-36VM54SC.js';
 export { ShellPrefsProvider, useLocalStoragePrefs, useShellPrefs } from './chunk-36VM54SC.js';
-import { PREVIEW_OPENED_EVENT, openPreviewFile } from './chunk-LZCEK7JF.js';
+import { PREVIEW_OPENED_EVENT, openPreviewFile } from './chunk-K5ZMTKZC.js';
 import { playNotification, playStartup, soundsEnabled, getSoundConfig, SOUND_PACK_KEYS, SOUND_PACKS, SOUND_TYPES, SOUND_TYPE_LABELS, setSoundForType, previewSound, setAllSounds, playLogout } from './chunk-D7PYW2QS.js';
-import { setPdfPreview } from './chunk-NRT2CU5Q.js';
+import { setPdfPreview } from './chunk-BRWWUKPE.js';
 import './chunk-KUIPWCTJ.js';
 import { toast_default } from './chunk-WIJ45SYD.js';
 export { toast_default as toast } from './chunk-WIJ45SYD.js';
-export { EditableGrid } from './chunk-6YY6A6SV.js';
-import { useWindowManager, PopupMenu, PopupMenuLabel, PopupMenuDivider, PopupMenuItem, Modal, ModalActions, useIsMobile, useModalActive, client_default, LoadingSpinner, WINDOW_REGISTRY, isPageEntry, ThumbCard, activateModal } from './chunk-GI7ABQPU.js';
-export { CancelButton, CopyButton, DocFavStar, Modal, ModalActions, PopupMenu, PopupMenuDivider, PopupMenuItem, PopupMenuLabel, WindowManagerProvider, WindowTitle, commitExposeHighlight, exitExposeMode, getActiveWindowRoute, getExposeHighlight, isEntityEntry, isPageEntry, setExposeHighlight, setShellApiClient, setShellWindowRegistry, setWindowDefaultPosition, subscribeExposeHighlight, toggleExposeMode, useModalActive, useWidgetSettings, useWindowManager, useWindowMenuItem, useWindowTitle } from './chunk-GI7ABQPU.js';
+export { EditableGrid } from './chunk-6FNC3APL.js';
+import { useWindowManager, PopupMenu, PopupMenuLabel, PopupMenuDivider, PopupMenuItem, Modal, ModalActions, useIsMobile, useModalActive, client_default, LoadingSpinner, WINDOW_REGISTRY, isPageEntry, ThumbCard, activateModal } from './chunk-2TNV3ODP.js';
+export { CancelButton, CopyButton, DocFavStar, Modal, ModalActions, PopupMenu, PopupMenuDivider, PopupMenuItem, PopupMenuLabel, WindowManagerProvider, WindowTitle, commitExposeHighlight, exitExposeMode, getActiveWindowRoute, getExposeHighlight, isEntityEntry, isPageEntry, setExposeHighlight, setShellApiClient, setShellWindowRegistry, setWindowDefaultPosition, subscribeExposeHighlight, toggleExposeMode, useModalActive, useWidgetSettings, useWindowManager, useWindowMenuItem, useWindowTitle } from './chunk-2TNV3ODP.js';
 import { confirm } from './chunk-PLGHQ7QW.js';
 export { ConfirmProvider, confirm, confirmDestructive, prompt } from './chunk-PLGHQ7QW.js';
 import { useAuth, useShellAuth } from './chunk-ADJ3CERD.js';
 export { ShellAuthProvider, setShellAuthBridge, useShellAuth } from './chunk-ADJ3CERD.js';
-import { glassStyle, startMenuCategories, navSections, isSection, GLASS_INPUT_BG, navIcons, sectionIcons } from './chunk-SSA762W5.js';
-export { GLASS_DIVIDER, GLASS_INPUT_BG, glassStyle, setShellNavIcons } from './chunk-SSA762W5.js';
+import { glassStyle, startMenuCategories, navSections, isSection, GLASS_INPUT_BG, navIcons, sectionIcons } from './chunk-YJONGQLG.js';
+export { GLASS_DIVIDER, GLASS_INPUT_BG, glassStyle, setShellNavIcons } from './chunk-YJONGQLG.js';
 import { createContext, lazy, useState, useRef, useEffect, useCallback, useLayoutEffect, useContext, Suspense, isValidElement, cloneElement, useMemo, useSyncExternalStore } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { Dialog, DialogBackdrop, DialogPanel, DialogTitle } from '@headlessui/react';
@@ -915,7 +915,7 @@ function StatusBadge({ status }) {
 }
 
 // src/version.ts
-var VERSION = "0.4.0" ;
+var VERSION = "0.5.0" ;
 var APP_VERSION = VERSION;
 
 // src/changelog.ts
@@ -2895,17 +2895,25 @@ function StartMenu({
   const isMobile = useIsMobile();
   const [hoveredSection, setHoveredSection] = useState(null);
   const [hoveredY, setHoveredY] = useState(0);
+  const [hoveredChild, setHoveredChild] = useState(null);
+  const [hoveredChildY, setHoveredChildY] = useState(0);
   const [search, setSearch] = useState("");
   const [searchIdx, setSearchIdx] = useState(0);
   const menuRef = useRef(null);
+  const flyoutRef = useRef(null);
   const hoverTimeout = useRef();
+  const childHoverTimeout = useRef();
   useEffect(() => {
     if (!open) {
       setSearch("");
       setHoveredSection(null);
+      setHoveredChild(null);
       setSearchIdx(0);
     }
   }, [open]);
+  useEffect(() => {
+    setHoveredChild(null);
+  }, [hoveredSection]);
   useEffect(() => {
     if (!open) return;
     const handler = (e) => {
@@ -2929,18 +2937,20 @@ function StartMenu({
   };
   if (isMobile) {
     const allItems = [];
+    const pushItem = (it, sectionLabel) => {
+      if (it.perms && !hasAnyPerm(it.perms)) return;
+      allItems.push({ item: it, sectionLabel });
+      if (it.children) {
+        for (const c of it.children) pushItem(c, it.label);
+      }
+    };
     for (const entry of navSections2) {
       if (isSection(entry)) {
         const sec = entry;
         if (sec.perms && !hasAnyPerm(sec.perms)) continue;
-        for (const it of sec.items) {
-          if (it.perms && !hasAnyPerm(it.perms)) continue;
-          allItems.push({ item: it, sectionLabel: sec.label });
-        }
+        for (const it of sec.items) pushItem(it, sec.label);
       } else {
-        const it = entry;
-        if (it.perms && !hasAnyPerm(it.perms)) continue;
-        allItems.push({ item: it });
+        pushItem(entry);
       }
     }
     const filtered = search.length >= 1 ? allItems.filter(({ item }) => item.label.toLowerCase().includes(search.toLowerCase())) : allItems;
@@ -2994,11 +3004,23 @@ function StartMenu({
   const erpSections = navSections2.filter((item) => isSection(item) && erpLabels.has(item.label));
   const systemSections = navSections2.filter((item) => isSection(item) && systemLabels.has(item.label));
   const getVisibleItems = (section) => section.items.filter((item) => !item.perms || hasAnyPerm(item.perms));
+  const matchTree = (it, sectionLabel) => {
+    if (it.perms && !hasAnyPerm(it.perms)) return [];
+    const hits = [];
+    if (it.label.toLowerCase().includes(search.toLowerCase())) {
+      hits.push({ ...it, section: sectionLabel });
+    }
+    if (it.children) {
+      for (const c of it.children) hits.push(...matchTree(c, it.label));
+    }
+    return hits;
+  };
   const searchResults = search.length >= 2 ? navSections2.flatMap((item) => {
     if (isSection(item)) {
-      return item.items.filter((i) => (!i.perms || hasAnyPerm(i.perms)) && i.label.toLowerCase().includes(search.toLowerCase())).map((i) => ({ ...i, section: item.label }));
+      const sec = item;
+      return sec.items.flatMap((i) => matchTree(i, sec.label));
     }
-    return item.label.toLowerCase().includes(search.toLowerCase()) ? [{ ...item, section: "" }] : [];
+    return matchTree(item, "");
   }) : [];
   const posStyle = taskbarPosition === "top" ? { top: taskbarH + 8, left: 8 } : taskbarPosition === "left" ? { top: 8, left: taskbarW + 8 } : taskbarPosition === "right" ? { top: 8, right: taskbarW + 8 } : { bottom: taskbarH + 8, left: 8 };
   const iconEl = (path) => {
@@ -3204,28 +3226,91 @@ function StartMenu({
       hoveredSection && flyoutItems.length > 0 && search.length < 2 && /* @__PURE__ */ jsx(
         "div",
         {
+          ref: flyoutRef,
           className: `fixed ${sizeConfig.fw} rounded-2xl overflow-hidden`,
           style: { left: menuRef.current ? menuRef.current.getBoundingClientRect().right + 4 : menuWidth + 12, top: flyoutTop, animation: "submenu-in 0.1s ease-out", ...menuGlass },
           onMouseEnter: () => clearTimeout(hoverTimeout.current),
           onMouseLeave: () => {
-            hoverTimeout.current = setTimeout(() => setHoveredSection(null), 200);
+            hoverTimeout.current = setTimeout(() => {
+              setHoveredSection(null);
+              setHoveredChild(null);
+            }, 200);
           },
-          children: /* @__PURE__ */ jsx("div", { className: "py-1 px-1", children: flyoutItems.map((item) => /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsxs(
-              "button",
+          children: /* @__PURE__ */ jsx("div", { className: "py-1 px-1", children: flyoutItems.map((item) => {
+            const hasChildren = !!item.children && item.children.length > 0;
+            const isChildHovered = hoveredChild === item.to;
+            return /* @__PURE__ */ jsxs(
+              "div",
               {
-                onClick: () => handleClick(item.to),
-                className: `${itemCls} text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition-colors`,
+                onMouseEnter: hasChildren ? (e) => {
+                  clearTimeout(childHoverTimeout.current);
+                  const rect = e.currentTarget.getBoundingClientRect();
+                  setHoveredChildY(rect.top + rect.height / 2);
+                  setHoveredChild(item.to);
+                } : () => {
+                  childHoverTimeout.current = setTimeout(() => setHoveredChild(null), 200);
+                },
                 children: [
-                  iconEl(item.to),
-                  /* @__PURE__ */ jsx("span", { children: item.label })
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: () => handleClick(item.to),
+                      className: `${itemCls} transition-colors ${isChildHovered ? "bg-blue-50 text-blue-700" : "text-gray-700 hover:bg-blue-50 hover:text-blue-700"}`,
+                      children: [
+                        iconEl(item.to),
+                        /* @__PURE__ */ jsx("span", { children: item.label }),
+                        hasChildren && /* @__PURE__ */ jsx("svg", { className: "h-3.5 w-3.5 ml-auto text-gray-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8.25 4.5l7.5 7.5-7.5 7.5" }) })
+                      ]
+                    }
+                  ),
+                  item.dividerAfter && /* @__PURE__ */ jsx("div", { className: "border-t border-white/20 my-1.5 mx-2" })
                 ]
-              }
-            ),
-            item.dividerAfter && /* @__PURE__ */ jsx("div", { className: "border-t border-white/20 my-1.5 mx-2" })
-          ] }, item.to)) })
+              },
+              item.to
+            );
+          }) })
         }
-      )
+      ),
+      (() => {
+        if (search.length >= 2 || !hoveredChild) return null;
+        const parent = flyoutItems.find((it) => it.to === hoveredChild);
+        const kids = (parent?.children ?? []).filter((c) => !c.perms || hasAnyPerm(c.perms));
+        if (!parent || kids.length === 0) return null;
+        const flyoutRect = flyoutRef.current?.getBoundingClientRect();
+        const subLeft = flyoutRect ? flyoutRect.right + 4 : 0;
+        const subH = kids.length * sizeConfig.itemH + 12;
+        let subTop = hoveredChildY - subH / 2;
+        if (subTop < minTop) subTop = minTop;
+        if (subTop + subH > maxBottom) subTop = maxBottom - subH;
+        return /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `fixed ${sizeConfig.fw} rounded-2xl overflow-hidden`,
+            style: { left: subLeft, top: subTop, animation: "submenu-in 0.1s ease-out", ...menuGlass },
+            onMouseEnter: () => {
+              clearTimeout(hoverTimeout.current);
+              clearTimeout(childHoverTimeout.current);
+            },
+            onMouseLeave: () => {
+              childHoverTimeout.current = setTimeout(() => setHoveredChild(null), 200);
+            },
+            children: /* @__PURE__ */ jsx("div", { className: "py-1 px-1", children: kids.map((child) => /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  onClick: () => handleClick(child.to),
+                  className: `${itemCls} text-gray-700 hover:bg-blue-50 hover:text-blue-700 transition-colors`,
+                  children: [
+                    iconEl(child.to),
+                    /* @__PURE__ */ jsx("span", { children: child.label })
+                  ]
+                }
+              ),
+              child.dividerAfter && /* @__PURE__ */ jsx("div", { className: "border-t border-white/20 my-1.5 mx-2" })
+            ] }, child.to)) })
+          }
+        );
+      })()
     ] }),
     /* @__PURE__ */ jsx("style", { children: `
         @keyframes menu-in { from { opacity: 0; transform: scale(0.95) translateY(8px); } to { opacity: 1; transform: scale(1) translateY(0); } }
@@ -3996,7 +4081,7 @@ function MobileBottomNav({
     }
   );
 }
-var Sidebar = lazy(() => import('./Sidebar-4V6NQROQ.js'));
+var Sidebar = lazy(() => import('./Sidebar-SHNDADVO.js'));
 function useFavorites(wallpapers) {
   const { prefs, save } = useShellPrefs();
   const favorites = prefs.favorite_pages || [];