react-os-shell 4.55.0 → 4.63.0

package/dist/{chunk-5S65ZC5W.js → chunk-JMESET3G.js}

@@ -1338,6 +1338,8 @@ function workArea() {
 }
 var CAPTION_H = 40;
 var MIN_VISIBLE_X = 80;
+var MIN_W = 384;
+var MIN_H = 400;
 function clampReachable(box, a = workArea()) {
   const x = Math.min(Math.max(box.x, a.x + MIN_VISIBLE_X - box.w), a.x + a.w - MIN_VISIBLE_X);
   const y = Math.min(Math.max(box.y, a.y), a.y + a.h - CAPTION_H);
@@ -2300,8 +2302,6 @@ function Modal({ open, onClose, title, icon, copyText, size = "lg", dirty = fals
     const oy = rect ? rect.top : boxRef.current.y;
     const ow = rect ? rect.width : boxRef.current.w;
     const oh = rect ? rect.height : boxRef.current.h;
-    const MIN_W = 384;
-    const MIN_H = 400;
     const isWest = corner === "sw" || corner === "nw" || corner === "w";
     const isNorth = corner === "ne" || corner === "nw" || corner === "n";
     const isEast = corner === "se" || corner === "ne" || corner === "e";
@@ -2359,6 +2359,77 @@ function Modal({ open, onClose, title, icon, copyText, size = "lg", dirty = fals
     window.addEventListener("pointermove", move);
     window.addEventListener("pointerup", up);
   }, []);
+  const KEY_STEP = 24;
+  const onTitleBarKeyDown = useCallback((e) => {
+    if (e.target.closest("button, input, a, kbd, select, textarea")) return;
+    const arrows = {
+      ArrowLeft: [-1, 0],
+      ArrowRight: [1, 0],
+      ArrowUp: [0, -1],
+      ArrowDown: [0, 1]
+    };
+    const dir = arrows[e.key];
+    if (!dir && e.key !== "Enter") return;
+    e.preventDefault();
+    e.stopPropagation();
+    activateModal(modalId);
+    if (e.key === "Enter") {
+      if (maximized) {
+        setMaximized(false);
+        setBox(calcWindowed());
+      } else {
+        setMaximized(true);
+        setBox(calcMaximized());
+      }
+      return;
+    }
+    const [dx, dy] = dir;
+    if (e.ctrlKey || e.metaKey) {
+      const savePreSnap = () => {
+        if (!preSnapBoxRef.current) preSnapBoxRef.current = { ...boxRef.current };
+      };
+      if (dy < 0) {
+        savePreSnap();
+        setMaximized(true);
+        setBox(calcMaximized());
+        return;
+      }
+      if (dy > 0) {
+        if (maximized) {
+          setMaximized(false);
+          setBox(calcWindowed());
+          return;
+        }
+        if (preSnapBoxRef.current) {
+          const restore = clampReachable(preSnapBoxRef.current);
+          preSnapBoxRef.current = null;
+          boxRef.current = restore;
+          setBox(restore);
+          return;
+        }
+        _minimizeModal(modalId);
+        return;
+      }
+      savePreSnap();
+      setMaximized(false);
+      const snapped = calcSnapBox(dx < 0 ? "left" : "right");
+      boxRef.current = snapped;
+      setBox(snapped);
+      return;
+    }
+    if (maximized) return;
+    const b = boxRef.current;
+    const next = e.shiftKey ? { ...b, w: Math.max(MIN_W, b.w + dx * KEY_STEP), h: Math.max(MIN_H, b.h + dy * KEY_STEP) } : clampReachable({ ...b, x: b.x + dx * KEY_STEP, y: Math.max(0, b.y + dy * KEY_STEP) });
+    boxRef.current = next;
+    setBox(next);
+  }, [modalId, maximized, calcWindowed, calcMaximized]);
+  const titleBarKeyProps = alwaysMaximized || exposeActive ? {} : {
+    tabIndex: 0,
+    role: "group",
+    "aria-label": titleTooltip ? `${titleTooltip} \u2014 window` : "Window",
+    "aria-keyshortcuts": "ArrowUp ArrowDown ArrowLeft ArrowRight Shift+ArrowUp Shift+ArrowDown Shift+ArrowLeft Shift+ArrowRight Control+ArrowUp Control+ArrowDown Control+ArrowLeft Control+ArrowRight Enter",
+    onKeyDown: onTitleBarKeyDown
+  };
   const reset = () => {
     setMaximized(true);
     setBox(calcMaximized());
@@ -2605,7 +2676,8 @@ function Modal({ open, onClose, title, icon, copyText, size = "lg", dirty = fals
               {
                 onPointerDown: startDrag,
                 "data-window-chrome": "",
-                className: `flex items-center justify-between px-3 py-1.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl ${isActive ? "backdrop-blur-sm" : ""}`,
+                ...titleBarKeyProps,
+                className: `flex items-center justify-between px-3 py-1.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-400 ${isActive ? "backdrop-blur-sm" : ""}`,
                 style: { touchAction: "none", backgroundColor: isActive ? `rgb(var(--window-header-rgb) / var(--active-header-opacity, 0.8))` : `rgb(var(--window-header-rgb) / var(--inactive-header-opacity, 0.7))` },
                 children: [
                   /* @__PURE__ */ jsxs("div", { "data-window-title": true, title: titleTooltip, className: "text-sm font-medium min-w-0 flex-1 truncate flex items-center gap-1.5", style: { color: isActive ? "var(--window-title-active, rgb(17 24 39))" : "var(--window-title-inactive, rgb(156 163 175))" }, children: [
@@ -2634,7 +2706,8 @@ function Modal({ open, onClose, title, icon, copyText, size = "lg", dirty = fals
               {
                 onPointerDown: startDrag,
                 "data-window-chrome": "",
-                className: `flex items-center justify-between px-3 py-1.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl ${isActive ? "backdrop-blur-sm" : ""}`,
+                ...titleBarKeyProps,
+                className: `flex items-center justify-between px-3 py-1.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-400 ${isActive ? "backdrop-blur-sm" : ""}`,
                 style: { touchAction: "none", backgroundColor: isActive ? `rgb(var(--window-header-rgb) / var(--active-header-opacity, 0.8))` : `rgb(var(--window-header-rgb) / var(--inactive-header-opacity, 0.7))` },
                 children: [
                   /* @__PURE__ */ jsxs("div", { "data-window-title": true, title: titleTooltip, className: "text-sm font-medium min-w-0 flex-1 truncate flex items-center gap-1.5", style: { color: isActive ? "var(--window-title-active, rgb(17 24 39))" : "var(--window-title-inactive, rgb(156 163 175))" }, children: [
@@ -2670,7 +2743,8 @@ function Modal({ open, onClose, title, icon, copyText, size = "lg", dirty = fals
             {
               onPointerDown: startDrag,
               "data-window-chrome": "",
-              className: `flex items-center justify-between px-4 py-2.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl ${isActive ? "backdrop-blur-sm" : ""}`,
+              ...titleBarKeyProps,
+              className: `flex items-center justify-between px-4 py-2.5 border-b border-gray-200 shrink-0 cursor-move select-none rounded-t-2xl focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-400 ${isActive ? "backdrop-blur-sm" : ""}`,
               style: { touchAction: "none", backgroundColor: isActive ? `rgb(var(--window-header-rgb) / var(--active-header-opacity, 0.8))` : `rgb(var(--window-header-rgb) / var(--inactive-header-opacity, 0.7))` },
               children: [
                 /* @__PURE__ */ jsxs("div", { "data-window-title": true, title: titleTooltip, className: "text-base font-medium min-w-0 flex-1 truncate flex items-center gap-2", style: { color: isActive ? "var(--window-title-active, rgb(17 24 39))" : "var(--window-title-inactive, rgb(156 163 175))" }, children: [
@@ -3126,5 +3200,5 @@ function useUndoableState(initial, opts) {
 }
 
 export { CancelButton, CopyButton, DocFavStar, LoadingSpinner, Modal, ModalActions, SIDEBAR_STRIP_W, UndoProvider, WINDOW_REGISTRY, WindowCrashedFallback, WindowErrorBoundary, WindowManagerProvider, WindowTitle, beginWindowGesture, cancelWindowFront, client_default, commitExposeHighlight, drainPerfEvents, exitExposeMode, forgetMaximizedWindowBoxes, getActiveModalId, getActiveWindowRoute, getExposeHighlight, getWindowPosition, isEntityEntry, isPageEntry, isShellApiClientConfigured, markMenuOpen, requestWindowFront, setExposeHighlight, setPerfCollecting, setShellApiClient, setShellWindowRegistry, setWindowDefaultPosition, setWindowPosition, subscribeExposeHighlight, toggleExposeMode, useEnclosingModalId, useIsActiveWindow, useModalActive, useUndo, useUndoable, useUndoableState, useWidgetSettings, useWindowDirty, useWindowManager, useWindowMenuItem, useWindowTitle };
-//# sourceMappingURL=chunk-5S65ZC5W.js.map
-//# sourceMappingURL=chunk-5S65ZC5W.js.map
+//# sourceMappingURL=chunk-JMESET3G.js.map
+//# sourceMappingURL=chunk-JMESET3G.js.map