@xenide-io/the-old-ui-theme 0.6.9 → 0.6.11

package/dist/suite.mjs

@@ -1508,7 +1508,7 @@ function SuiteMobileDrawer({
         tabIndex: -1,
         "data-test": panelDataTest,
         className: cn(
-          "suite-scroll-lock relative flex h-full w-[86%] max-w-72 flex-col overflow-hidden bg-ph-surface shadow-xl outline-none motion-safe:transition-transform motion-safe:ease-spring-fast",
+          "relative flex h-dvh max-h-dvh w-[86%] max-w-72 flex-col overflow-hidden bg-ph-surface shadow-xl outline-none motion-safe:transition-transform motion-safe:ease-spring-fast",
           side === "right" && "ml-auto",
           shown ? "translate-x-0" : side === "right" ? "translate-x-full" : "-translate-x-full",
           panelClassName
@@ -1539,7 +1539,14 @@ function SuiteMobileDrawer({
               ]
             }
           ) : null,
-          children
+          /* @__PURE__ */ jsx10(
+            "div",
+            {
+              "data-test": "suite-mobile-drawer-body",
+              className: "suite-scroll-lock flex min-h-0 flex-1 flex-col overflow-y-auto overscroll-contain pb-[max(0.75rem,env(safe-area-inset-bottom))]",
+              children
+            }
+          )
         ]
       }
     )
@@ -2174,9 +2181,47 @@ import {
   Square,
   WarningTriangle
 } from "iconoir-react";
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 var SuiteAiBlockNoteMessage = lazy(() => import("./ai-message-blocknote-DIUICX3G.mjs"));
 var SUITE_OPEN_ASK_AI_EVENT = "shellstack:open-ask-ai";
+var SUITE_ASK_AI_OPEN_KEY = "shellstack:shelly-open";
+var SUITE_ASK_AI_OPEN_QUERY = "shelly";
+var SUITE_MUTATED_EVENT = "shellstack:suite-mutated";
+var TURTLETIME_TIMER_MUTATED_EVENT = "tt-timer-mutated";
+function persistSuiteAskAiOpen(open) {
+  if (typeof window === "undefined") return;
+  try {
+    if (open) sessionStorage.setItem(SUITE_ASK_AI_OPEN_KEY, "1");
+    else sessionStorage.removeItem(SUITE_ASK_AI_OPEN_KEY);
+  } catch (e) {
+  }
+}
+function readSuiteAskAiOpen() {
+  if (typeof window === "undefined") return false;
+  try {
+    return sessionStorage.getItem(SUITE_ASK_AI_OPEN_KEY) === "1";
+  } catch (e) {
+    return false;
+  }
+}
+function pathWithSuiteAskAiOpen(path) {
+  const url = new URL((path || "/").trim() || "/", "http://local.invalid");
+  url.searchParams.set(SUITE_ASK_AI_OPEN_QUERY, "1");
+  return `${url.pathname}${url.search}${url.hash}`;
+}
+function consumeSuiteAskAiOpenFromLocation() {
+  if (typeof window === "undefined") return false;
+  const url = new URL(window.location.href);
+  if (url.searchParams.get(SUITE_ASK_AI_OPEN_QUERY) !== "1") return false;
+  persistSuiteAskAiOpen(true);
+  url.searchParams.delete(SUITE_ASK_AI_OPEN_QUERY);
+  window.history.replaceState(
+    window.history.state,
+    "",
+    `${url.pathname}${url.search}${url.hash}`
+  );
+  return true;
+}
 var pendingAskAiPrompt = null;
 function openSuiteAskAi(detail) {
   var _a;
@@ -2193,6 +2238,18 @@ function consumePendingAskAiPrompt() {
   pendingAskAiPrompt = null;
   return next;
 }
+function notifySuiteMutated(actions) {
+  if (typeof window === "undefined" || !(actions == null ? void 0 : actions.length)) return;
+  const kinds = actions.map((action) => action.kind);
+  if (kinds.some(
+    (kind) => kind.includes("timer") || kind.includes("time") || kind.includes("hours")
+  )) {
+    window.dispatchEvent(new Event(TURTLETIME_TIMER_MUTATED_EVENT));
+  }
+  window.dispatchEvent(
+    new CustomEvent(SUITE_MUTATED_EVENT, { detail: { kinds } })
+  );
+}
 function SuiteAiPanel({
   presets = [],
   emptyState = "Ask when you are ready \u2014 overdue work, a running timer, or anything else.",
@@ -2205,13 +2262,17 @@ function SuiteAiPanel({
   open: openProp,
   onOpenChange,
   suiteAppBases,
-  onSwitchApp
+  onSwitchApp,
+  onSameAppNavigate,
+  resolveAction
 }) {
   const inputId = useId();
   const [uncontrolledOpen, setUncontrolledOpen] = useState7(false);
+  const [resolvingId, setResolvingId] = useState7("");
   const open = openProp != null ? openProp : uncontrolledOpen;
   const setOpen = useCallback2(
     (next) => {
+      persistSuiteAskAiOpen(next);
       if (openProp === void 0) setUncontrolledOpen(next);
       onOpenChange == null ? void 0 : onOpenChange(next);
     },
@@ -2312,7 +2373,14 @@ function SuiteAiPanel({
         signal: controller.signal
       });
       if (controller.signal.aborted) return;
-      setMessages((_a = result.messages) != null ? _a : []);
+      const nextMessages = (_a = result.messages) != null ? _a : [];
+      setMessages(nextMessages);
+      notifySuiteMutated(
+        nextMessages.flatMap((message) => {
+          var _a2;
+          return (_a2 = message.actions) != null ? _a2 : [];
+        })
+      );
     } catch (err) {
       if (controller.signal.aborted) return;
       setMessages(
@@ -2355,6 +2423,29 @@ function SuiteAiPanel({
       );
     }
   }
+  async function handleResolve(actionId, decision) {
+    var _a;
+    if (!resolveAction || resolvingId) return;
+    setResolvingId(actionId);
+    setError("");
+    try {
+      const result = await resolveAction(actionId, decision);
+      const nextMessages = (_a = result.messages) != null ? _a : [];
+      setMessages(nextMessages);
+      notifySuiteMutated(
+        nextMessages.flatMap((message) => {
+          var _a2;
+          return (_a2 = message.actions) != null ? _a2 : [];
+        })
+      );
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : "Could not apply that action."
+      );
+    } finally {
+      setResolvingId("");
+    }
+  }
   function onConversationClick(event) {
     var _a;
     if (event.defaultPrevented) return;
@@ -2372,12 +2463,15 @@ function SuiteAiPanel({
     );
     if (!match) return;
     event.preventDefault();
+    persistSuiteAskAiOpen(true);
     if (match.sameApp) {
-      window.location.assign(match.path);
+      if (onSameAppNavigate) onSameAppNavigate(match.path);
+      else window.location.assign(pathWithSuiteAskAiOpen(match.path));
       return;
     }
-    if (onSwitchApp) onSwitchApp(match.slug, match.path);
-    else window.location.assign(anchor.href);
+    const openPath = pathWithSuiteAskAiOpen(match.path);
+    if (onSwitchApp) onSwitchApp(match.slug, openPath);
+    else window.location.assign(new URL(openPath, href).toString());
   }
   if (!open) return null;
   const Icon = BrandIcon != null ? BrandIcon : Sparks;
@@ -2442,6 +2536,7 @@ function SuiteAiPanel({
                   )) }) : null
                 ] }) : null,
                 messages.map((message, index) => {
+                  var _a;
                   const isUser = message.role === "user";
                   if (isUser) {
                     return /* @__PURE__ */ jsx17(
@@ -2468,13 +2563,67 @@ function SuiteAiPanel({
                             children: /* @__PURE__ */ jsx17(Icon, { className: "h-3.5 w-3.5" })
                           }
                         ),
-                        /* @__PURE__ */ jsx17("div", { className: "min-w-0 max-w-[85%] rounded-2xl rounded-bl-md bg-ph-muted px-3 py-2 text-sm leading-relaxed text-ph-ink", children: /* @__PURE__ */ jsx17(
-                          Suspense,
-                          {
-                            fallback: /* @__PURE__ */ jsx17("p", { className: "whitespace-pre-wrap break-words", children: message.content }),
-                            children: /* @__PURE__ */ jsx17(SuiteAiBlockNoteMessage, { markdown: message.content })
-                          }
-                        ) })
+                        /* @__PURE__ */ jsxs15("div", { className: "min-w-0 max-w-[85%] space-y-2", children: [
+                          /* @__PURE__ */ jsx17("div", { className: "rounded-2xl rounded-bl-md bg-ph-muted px-3 py-2 text-sm leading-relaxed text-ph-ink", children: /* @__PURE__ */ jsx17(
+                            Suspense,
+                            {
+                              fallback: /* @__PURE__ */ jsx17("p", { className: "whitespace-pre-wrap break-words", children: message.content }),
+                              children: /* @__PURE__ */ jsx17(SuiteAiBlockNoteMessage, { markdown: message.content })
+                            }
+                          ) }),
+                          ((_a = message.actions) != null ? _a : []).map((action) => /* @__PURE__ */ jsxs15(
+                            "div",
+                            {
+                              "data-test": "ask-ai-action",
+                              "data-status": action.status,
+                              className: "rounded-xl border border-ph-border bg-ph-surface px-3 py-2 text-sm text-ph-ink",
+                              children: [
+                                /* @__PURE__ */ jsx17("p", { className: "font-medium", children: action.summary }),
+                                action.status === "proposed" ? /* @__PURE__ */ jsxs15("div", { className: "mt-2 flex flex-wrap gap-2", children: [
+                                  /* @__PURE__ */ jsx17(
+                                    "button",
+                                    {
+                                      type: "button",
+                                      "data-test": "ask-ai-action-confirm",
+                                      disabled: Boolean(resolvingId) || !resolveAction,
+                                      onClick: () => void handleResolve(action.id, "confirm"),
+                                      className: "inline-flex min-h-8 items-center rounded-lg bg-ph-brand px-2.5 text-xs font-medium text-[color:var(--ph-on-accent)] transition-opacity hover:bg-ph-brand-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-focus disabled:opacity-40",
+                                      children: resolvingId === action.id ? "Working\u2026" : "Confirm"
+                                    }
+                                  ),
+                                  /* @__PURE__ */ jsx17(
+                                    "button",
+                                    {
+                                      type: "button",
+                                      "data-test": "ask-ai-action-cancel",
+                                      disabled: Boolean(resolvingId) || !resolveAction,
+                                      onClick: () => void handleResolve(action.id, "cancel"),
+                                      className: "inline-flex min-h-8 items-center rounded-lg border border-ph-border bg-ph-surface px-2.5 text-xs font-medium text-ph-ink transition-colors hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-focus disabled:opacity-40",
+                                      children: "Cancel"
+                                    }
+                                  )
+                                ] }) : null,
+                                action.status === "applied" ? /* @__PURE__ */ jsxs15("p", { className: "mt-1 text-xs text-ph-subtle", children: [
+                                  "Done",
+                                  action.href ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
+                                    " \xB7 ",
+                                    /* @__PURE__ */ jsx17(
+                                      "a",
+                                      {
+                                        href: action.href,
+                                        className: "text-ph-brand underline-offset-2 hover:underline",
+                                        children: "Open"
+                                      }
+                                    )
+                                  ] }) : null
+                                ] }) : null,
+                                action.status === "cancelled" ? /* @__PURE__ */ jsx17("p", { className: "mt-1 text-xs text-ph-subtle", children: "Cancelled" }) : null,
+                                action.status === "failed" ? /* @__PURE__ */ jsx17("p", { className: "mt-1 text-xs text-ph-danger", children: action.error || "Could not apply that." }) : null
+                              ]
+                            },
+                            action.id
+                          ))
+                        ] })
                       ]
                     },
                     `assistant-${index}`
@@ -2579,7 +2728,7 @@ function SuiteAiPanel({
 // src/suite/components/workspace-switcher.tsx
 import { useState as useState8 } from "react";
 import { Building, Check as Check2, NavArrowDown } from "iconoir-react";
-import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 function SuiteWorkspaceSwitcher({
   workspaces = [],
   groups,
@@ -2620,7 +2769,7 @@ function SuiteWorkspaceSwitcher({
           "aria-expanded": open,
           children: [
             /* @__PURE__ */ jsx18(Building, { className: "h-4 w-4 shrink-0 text-ph-ink", "aria-hidden": true }),
-            !collapsed ? /* @__PURE__ */ jsxs16(Fragment5, { children: [
+            !collapsed ? /* @__PURE__ */ jsxs16(Fragment6, { children: [
               /* @__PURE__ */ jsx18("span", { className: "min-w-0 flex-1 truncate text-sm font-semibold text-ph-ink", children: name }),
               /* @__PURE__ */ jsx18(
                 NavArrowDown,
@@ -3007,9 +3156,9 @@ function SuiteSettingsMobileNav({
 
 // src/suite/components/suite-sidebar.tsx
 import Link2 from "next/link";
-import { useEffect as useEffect8 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect8 } from "react";
 import { NavArrowLeft, Sparks as Sparks2 } from "iconoir-react";
-import { Fragment as Fragment6, jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
 function renderNode(node, collapsed) {
   if (typeof node === "function") return node(collapsed);
   return node;
@@ -3032,30 +3181,37 @@ function SuiteSidebar({
 }) {
   const showAskAi = Boolean(onAskAiOpenChange && askAi);
   const chatOpen = showAskAi && askAiOpen && !collapsed;
+  const setAskAi = useCallback4(
+    (next) => {
+      persistSuiteAskAiOpen(next);
+      onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(next);
+    },
+    [onAskAiOpenChange]
+  );
   useEffect8(() => {
     if (!onAskAiOpenChange) return;
     function onOpen() {
       onRequestExpand == null ? void 0 : onRequestExpand();
-      onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(true);
+      setAskAi(true);
     }
     window.addEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
     return () => window.removeEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
-  }, [onAskAiOpenChange, onRequestExpand]);
+  }, [onAskAiOpenChange, onRequestExpand, setAskAi]);
   useEffect8(() => {
     if (!chatOpen) return;
     function onKey(event) {
-      if (event.key === "Escape") onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(false);
+      if (event.key === "Escape") setAskAi(false);
     }
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
-  }, [chatOpen, onAskAiOpenChange]);
+  }, [chatOpen, setAskAi]);
   function toggleAskAi() {
     if (askAiOpen) {
-      onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(false);
+      setAskAi(false);
       return;
     }
     if (collapsed) onRequestExpand == null ? void 0 : onRequestExpand();
-    onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(true);
+    setAskAi(true);
   }
   const askAiButton = /* @__PURE__ */ jsx22(
     "button",
@@ -3097,7 +3253,7 @@ function SuiteSidebar({
                     type: "button",
                     "data-test": "suite-ask-ai-back",
                     "aria-label": "Back to navigation",
-                    onClick: () => onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(false),
+                    onClick: () => setAskAi(false),
                     className: "inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg text-ph-subtle transition-colors hover:bg-ph-muted hover:text-ph-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
                     children: /* @__PURE__ */ jsx22(NavArrowLeft, { className: "h-4 w-4", "aria-hidden": true })
                   }
@@ -3152,7 +3308,7 @@ function SuiteSidebar({
                     {
                       type: "button",
                       "data-test": "suite-ask-ai-back",
-                      onClick: () => onAskAiOpenChange == null ? void 0 : onAskAiOpenChange(false),
+                      onClick: () => setAskAi(false),
                       className: "inline-flex h-9 items-center gap-1 rounded-lg px-2 text-sm font-medium text-ph-subtle transition-colors hover:bg-ph-muted hover:text-ph-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
                       children: [
                         /* @__PURE__ */ jsx22(NavArrowLeft, { className: "h-4 w-4", "aria-hidden": true }),
@@ -3163,7 +3319,7 @@ function SuiteSidebar({
                   /* @__PURE__ */ jsx22("span", { className: "truncate text-sm font-semibold text-ph-ink", children: "Shelly AI" })
                 ] }),
                 /* @__PURE__ */ jsx22("div", { className: "min-h-0 flex-1", children: askAi })
-              ] }) : /* @__PURE__ */ jsxs19(Fragment6, { children: [
+              ] }) : /* @__PURE__ */ jsxs19(Fragment7, { children: [
                 /* @__PURE__ */ jsx22("nav", { "aria-label": "Pages", className: "shrink-0 space-y-0.5", children: /* @__PURE__ */ jsx22("div", { className: "space-y-0.5", children: navItems.map((item) => {
                   var _a;
                   const Icon = item.icon;
@@ -3217,14 +3373,7 @@ function SuiteSidebar({
                   );
                   return collapsed ? /* @__PURE__ */ jsx22(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
                 }) }) }),
-                secondaryNav ? /* @__PURE__ */ jsx22(
-                  "div",
-                  {
-                    className: "min-h-0 flex-1",
-                    "data-test": "suite-sidebar-secondary-nav",
-                    children: secondaryNav
-                  }
-                ) : null
+                secondaryNav ? /* @__PURE__ */ jsx22("div", { className: "shrink-0", "data-test": "suite-sidebar-secondary-nav", children: secondaryNav }) : null
               ] })
             ]
           }
@@ -3363,8 +3512,11 @@ export {
   SIDEBAR_RAIL_WIDTH,
   SUITE_APPS2 as SUITE_APPS,
   SUITE_APP_MAP,
+  SUITE_ASK_AI_OPEN_KEY,
+  SUITE_ASK_AI_OPEN_QUERY,
   SUITE_GLYPHS,
   SUITE_ICON_NAMES,
+  SUITE_MUTATED_EVENT,
   SUITE_OPEN_ASK_AI_EVENT,
   SUITE_SPRINGS,
   SourceAppGlyph,
@@ -3394,6 +3546,7 @@ export {
   SuiteToolbar,
   SuiteUserMenu,
   SuiteWorkspaceSwitcher,
+  TURTLETIME_TIMER_MUTATED_EVENT,
   TodayAskAiCard,
   TodayCalibrating,
   TodayEmptyAction,
@@ -3412,9 +3565,13 @@ export {
   classifySuiteHref,
   cn,
   consumePendingAskAiPrompt,
+  consumeSuiteAskAiOpenFromLocation,
   getTodayGreeting,
   m,
   openSuiteAskAi,
+  pathWithSuiteAskAiOpen,
+  persistSuiteAskAiOpen,
+  readSuiteAskAiOpen,
   resolveSuiteNotificationHref,
   sidebarColumnWidth,
   sourceToSuiteApp,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenide-io/the-old-ui-theme",
-  "version": "0.6.9",
+  "version": "0.6.11",
   "description": "Props-driven React components and theme tokens inspired by classic interface design \u2014 optimized for Next.js apps and internal tools.",
   "author": "Xenide",
   "license": "MIT",

package/src/suite/components/ai-panel.test.ts

@@ -2,7 +2,13 @@ import { describe, expect, it, vi } from "vitest";
 
 import {
   consumePendingAskAiPrompt,
+  consumeSuiteAskAiOpenFromLocation,
   openSuiteAskAi,
+  pathWithSuiteAskAiOpen,
+  persistSuiteAskAiOpen,
+  readSuiteAskAiOpen,
+  SUITE_ASK_AI_OPEN_KEY,
+  SUITE_ASK_AI_OPEN_QUERY,
   SUITE_OPEN_ASK_AI_EVENT,
 } from "./ai-panel";
 
@@ -18,3 +24,40 @@ describe("openSuiteAskAi", () => {
     expect(consumePendingAskAiPrompt()).toBeNull();
   });
 });
+
+describe("persistSuiteAskAiOpen", () => {
+  it("remembers that Shelly was open across a same-tab navigation", () => {
+    sessionStorage.removeItem(SUITE_ASK_AI_OPEN_KEY);
+    persistSuiteAskAiOpen(true);
+    expect(readSuiteAskAiOpen()).toBe(true);
+    persistSuiteAskAiOpen(false);
+    expect(readSuiteAskAiOpen()).toBe(false);
+  });
+
+  it("stamps a cross-app path so the destination can reopen Shelly", () => {
+    expect(pathWithSuiteAskAiOpen("/tracker")).toBe(
+      `/tracker?${SUITE_ASK_AI_OPEN_QUERY}=1`,
+    );
+    expect(pathWithSuiteAskAiOpen("/dashboard?scope=mine")).toBe(
+      `/dashboard?scope=mine&${SUITE_ASK_AI_OPEN_QUERY}=1`,
+    );
+  });
+
+  it("opens Shelly from a cross-app query and then strips it", () => {
+    sessionStorage.removeItem(SUITE_ASK_AI_OPEN_KEY);
+    window.history.replaceState(
+      null,
+      "",
+      `/tracker?${SUITE_ASK_AI_OPEN_QUERY}=1`,
+    );
+    expect(consumeSuiteAskAiOpenFromLocation()).toBe(true);
+    expect(readSuiteAskAiOpen()).toBe(true);
+    expect(window.location.search).toBe("");
+  });
+
+  it("does not reopen Shelly from a leftover flag when switching apps", () => {
+    persistSuiteAskAiOpen(true);
+    window.history.replaceState(null, "", "/tracker");
+    expect(consumeSuiteAskAiOpenFromLocation()).toBe(false);
+  });
+});