@xenide-io/the-old-ui-theme 0.4.6 → 0.4.9

package/dist/suite.js

@@ -34,6 +34,9 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -56,6 +59,168 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
+// src/suite/components/theme-provider.tsx
+function systemTheme(fallback) {
+  if (typeof window === "undefined") return fallback;
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function resolveTheme(theme, fallback) {
+  return theme === "system" ? systemTheme(fallback) : theme;
+}
+function applyTheme(theme, config) {
+  const resolved = resolveTheme(theme, config.fallbackTheme);
+  if (typeof document === "undefined") return resolved;
+  document.documentElement.setAttribute(
+    "data-theme",
+    resolved === "dark" ? config.darkThemeId : config.lightThemeId
+  );
+  document.documentElement.classList.toggle("dark", resolved === "dark");
+  if (config.themeColorLight && config.themeColorDark) {
+    const meta = document.getElementById(
+      "theme-color-meta"
+    );
+    if (meta) {
+      meta.content = resolved === "light" ? config.themeColorLight : config.themeColorDark;
+    }
+  }
+  return resolved;
+}
+function readStoredTheme(storageKey) {
+  if (typeof window === "undefined") return "system";
+  const stored = localStorage.getItem(storageKey);
+  if (stored === "light" || stored === "dark" || stored === "system")
+    return stored;
+  return "system";
+}
+function SuiteThemeProvider({
+  config,
+  children
+}) {
+  const [state, setState] = (0, import_react7.useState)(() => {
+    const theme2 = readStoredTheme(config.storageKey);
+    if (typeof document === "undefined") {
+      return { theme: theme2, resolvedTheme: config.fallbackTheme };
+    }
+    const domTheme = document.documentElement.getAttribute("data-theme");
+    const resolvedTheme2 = domTheme === config.darkThemeId ? "dark" : domTheme === config.lightThemeId ? "light" : resolveTheme(theme2, config.fallbackTheme);
+    return { theme: theme2, resolvedTheme: resolvedTheme2 };
+  });
+  const { theme, resolvedTheme } = state;
+  (0, import_react7.useEffect)(() => {
+    if (theme !== "system") return;
+    const media = window.matchMedia("(prefers-color-scheme: dark)");
+    const update = () => {
+      const resolved = applyTheme("system", config);
+      setState((current) => __spreadProps(__spreadValues({}, current), { resolvedTheme: resolved }));
+    };
+    media.addEventListener("change", update);
+    return () => media.removeEventListener("change", update);
+  }, [theme, config]);
+  const setTheme = (0, import_react7.useCallback)(
+    (next) => {
+      const resolved = applyTheme(next, config);
+      setState({ theme: next, resolvedTheme: resolved });
+      localStorage.setItem(config.storageKey, next);
+    },
+    [config]
+  );
+  const toggleTheme = (0, import_react7.useCallback)(() => {
+    setState((prev) => {
+      const next = resolveTheme(prev.theme, config.fallbackTheme) === "dark" ? "light" : "dark";
+      const resolved = applyTheme(next, config);
+      localStorage.setItem(config.storageKey, next);
+      return { theme: next, resolvedTheme: resolved };
+    });
+  }, [config]);
+  const value = (0, import_react7.useMemo)(
+    () => ({ theme, resolvedTheme, setTheme, toggleTheme }),
+    [theme, resolvedTheme, setTheme, toggleTheme]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SuiteThemeContext.Provider, { value, children });
+}
+function useSuiteTheme() {
+  const ctx = (0, import_react7.useContext)(SuiteThemeContext);
+  if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
+  return ctx;
+}
+var import_react7, import_jsx_runtime18, SuiteThemeContext;
+var init_theme_provider = __esm({
+  "src/suite/components/theme-provider.tsx"() {
+    "use strict";
+    "use client";
+    import_react7 = require("react");
+    import_jsx_runtime18 = require("react/jsx-runtime");
+    SuiteThemeContext = (0, import_react7.createContext)(null);
+  }
+});
+
+// src/suite/components/ai-message-blocknote.tsx
+var ai_message_blocknote_exports = {};
+__export(ai_message_blocknote_exports, {
+  default: () => SuiteAiBlockNoteMessage
+});
+function SuiteAiBlockNoteMessage({
+  markdown
+}) {
+  const { resolvedTheme } = useSuiteTheme();
+  const editor = (0, import_react9.useCreateBlockNote)({ schema: assistantSchema });
+  (0, import_react8.useEffect)(() => {
+    try {
+      const blocks = editor.tryParseMarkdownToBlocks(markdown);
+      editor.replaceBlocks(
+        editor.document,
+        blocks.length > 0 ? blocks : [{ type: "paragraph", content: markdown }]
+      );
+    } catch (e) {
+      editor.replaceBlocks(editor.document, [
+        { type: "paragraph", content: markdown }
+      ]);
+    }
+  }, [editor, markdown]);
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    import_react9.BlockNoteViewRaw,
+    {
+      editor,
+      editable: false,
+      theme: resolvedTheme,
+      className: "suite-ai-blocknote",
+      formattingToolbar: false,
+      sideMenu: false,
+      slashMenu: false,
+      linkToolbar: false,
+      filePanel: false,
+      tableHandles: false,
+      comments: false
+    }
+  );
+}
+var import_react8, import_core, import_react9, import_style, import_jsx_runtime19, assistantSchema;
+var init_ai_message_blocknote = __esm({
+  "src/suite/components/ai-message-blocknote.tsx"() {
+    "use strict";
+    "use client";
+    import_react8 = require("react");
+    import_core = require("@blocknote/core");
+    import_react9 = require("@blocknote/react");
+    import_style = require("@blocknote/react/style.css");
+    init_theme_provider();
+    import_jsx_runtime19 = require("react/jsx-runtime");
+    assistantSchema = import_core.BlockNoteSchema.create({
+      blockSpecs: {
+        paragraph: import_core.defaultBlockSpecs.paragraph,
+        heading: import_core.defaultBlockSpecs.heading,
+        bulletListItem: import_core.defaultBlockSpecs.bulletListItem,
+        numberedListItem: import_core.defaultBlockSpecs.numberedListItem,
+        checkListItem: import_core.defaultBlockSpecs.checkListItem,
+        codeBlock: import_core.defaultBlockSpecs.codeBlock,
+        quote: import_core.defaultBlockSpecs.quote,
+        table: import_core.defaultBlockSpecs.table,
+        divider: import_core.defaultBlockSpecs.divider
+      }
+    });
+  }
+});
+
 // src/suite/index.ts
 var suite_exports = {};
 __export(suite_exports, {
@@ -122,7 +287,7 @@ __export(suite_exports, {
   appSwitcherTriggerClass: () => appSwitcherTriggerClass,
   cn: () => cn,
   getTodayGreeting: () => getTodayGreeting,
-  m: () => import_react10.m,
+  m: () => import_react12.m,
   openSuiteAskAi: () => openSuiteAskAi,
   resolveSuiteNotificationHref: () => resolveSuiteNotificationHref,
   sourceToSuiteApp: () => sourceToSuiteApp,
@@ -2217,98 +2382,16 @@ function TodayCalibrating({
   );
 }
 
-// src/suite/components/theme-provider.tsx
-var import_react7 = require("react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var SuiteThemeContext = (0, import_react7.createContext)(null);
-function systemTheme(fallback) {
-  if (typeof window === "undefined") return fallback;
-  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-}
-function resolveTheme(theme, fallback) {
-  return theme === "system" ? systemTheme(fallback) : theme;
-}
-function applyTheme(theme, config) {
-  const resolved = resolveTheme(theme, config.fallbackTheme);
-  if (typeof document === "undefined") return resolved;
-  document.documentElement.setAttribute(
-    "data-theme",
-    resolved === "dark" ? config.darkThemeId : config.lightThemeId
-  );
-  document.documentElement.classList.toggle("dark", resolved === "dark");
-  if (config.themeColorLight && config.themeColorDark) {
-    const meta = document.getElementById(
-      "theme-color-meta"
-    );
-    if (meta) {
-      meta.content = resolved === "light" ? config.themeColorLight : config.themeColorDark;
-    }
-  }
-  return resolved;
-}
-function readStoredTheme(storageKey) {
-  if (typeof window === "undefined") return "system";
-  const stored = localStorage.getItem(storageKey);
-  if (stored === "light" || stored === "dark" || stored === "system")
-    return stored;
-  return "system";
-}
-function SuiteThemeProvider({
-  config,
-  children
-}) {
-  const [state, setState] = (0, import_react7.useState)(() => {
-    const theme2 = readStoredTheme(config.storageKey);
-    if (typeof document === "undefined") {
-      return { theme: theme2, resolvedTheme: config.fallbackTheme };
-    }
-    const domTheme = document.documentElement.getAttribute("data-theme");
-    const resolvedTheme2 = domTheme === config.darkThemeId ? "dark" : domTheme === config.lightThemeId ? "light" : resolveTheme(theme2, config.fallbackTheme);
-    return { theme: theme2, resolvedTheme: resolvedTheme2 };
-  });
-  const { theme, resolvedTheme } = state;
-  (0, import_react7.useEffect)(() => {
-    if (theme !== "system") return;
-    const media = window.matchMedia("(prefers-color-scheme: dark)");
-    const update = () => {
-      const resolved = applyTheme("system", config);
-      setState((current) => __spreadProps(__spreadValues({}, current), { resolvedTheme: resolved }));
-    };
-    media.addEventListener("change", update);
-    return () => media.removeEventListener("change", update);
-  }, [theme, config]);
-  const setTheme = (0, import_react7.useCallback)(
-    (next) => {
-      const resolved = applyTheme(next, config);
-      setState({ theme: next, resolvedTheme: resolved });
-      localStorage.setItem(config.storageKey, next);
-    },
-    [config]
-  );
-  const toggleTheme = (0, import_react7.useCallback)(() => {
-    setState((prev) => {
-      const next = resolveTheme(prev.theme, config.fallbackTheme) === "dark" ? "light" : "dark";
-      const resolved = applyTheme(next, config);
-      localStorage.setItem(config.storageKey, next);
-      return { theme: next, resolvedTheme: resolved };
-    });
-  }, [config]);
-  const value = (0, import_react7.useMemo)(
-    () => ({ theme, resolvedTheme, setTheme, toggleTheme }),
-    [theme, resolvedTheme, setTheme, toggleTheme]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SuiteThemeContext.Provider, { value, children });
-}
-function useSuiteTheme() {
-  const ctx = (0, import_react7.useContext)(SuiteThemeContext);
-  if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
-  return ctx;
-}
+// src/suite/index.ts
+init_theme_provider();
 
 // src/suite/components/ai-panel.tsx
-var import_react8 = require("react");
+var import_react10 = require("react");
 var import_iconoir_react8 = require("iconoir-react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var SuiteAiBlockNoteMessage2 = (0, import_react10.lazy)(
+  () => Promise.resolve().then(() => (init_ai_message_blocknote(), ai_message_blocknote_exports))
+);
 var SUITE_OPEN_ASK_AI_EVENT = "shellstack:open-ask-ai";
 function openSuiteAskAi(detail) {
   if (typeof window === "undefined") return;
@@ -2318,6 +2401,22 @@ function openSuiteAskAi(detail) {
     })
   );
 }
+var LAUNCHER_EDGE_GAP = 12;
+var LAUNCHER_STORAGE_KEY = "suite-ask-ai-launcher-position";
+function resolveSuiteAiLauncherPosition(side, desiredY, viewportWidth, viewportHeight, launcherWidth, launcherHeight) {
+  const maxX = Math.max(
+    LAUNCHER_EDGE_GAP,
+    viewportWidth - launcherWidth - LAUNCHER_EDGE_GAP
+  );
+  const maxY = Math.max(
+    LAUNCHER_EDGE_GAP,
+    viewportHeight - launcherHeight - LAUNCHER_EDGE_GAP
+  );
+  return {
+    x: side === "left" ? LAUNCHER_EDGE_GAP : maxX,
+    y: Math.min(Math.max(desiredY, LAUNCHER_EDGE_GAP), maxY)
+  };
+}
 function SuiteAiPanel({
   presets = [],
   emptyState = "Ask anything about your workspace, or look something up online.",
@@ -2329,21 +2428,64 @@ function SuiteAiPanel({
   spinner: Spinner,
   hideLauncher = false
 }) {
-  const [open, setOpen] = (0, import_react8.useState)(false);
-  const [prompt, setPrompt] = (0, import_react8.useState)("");
-  const [messages, setMessages] = (0, import_react8.useState)([]);
-  const [loading, setLoading] = (0, import_react8.useState)(false);
-  const [hydrating, setHydrating] = (0, import_react8.useState)(false);
-  const [error, setError] = (0, import_react8.useState)("");
-  const [copiedId, setCopiedId] = (0, import_react8.useState)(null);
-  const scrollerRef = (0, import_react8.useRef)(null);
-  const pendingPromptRef = (0, import_react8.useRef)(null);
-  const scrollToBottom = (0, import_react8.useCallback)(() => {
+  const [open, setOpen] = (0, import_react10.useState)(false);
+  const [prompt, setPrompt] = (0, import_react10.useState)("");
+  const [messages, setMessages] = (0, import_react10.useState)([]);
+  const [loading, setLoading] = (0, import_react10.useState)(false);
+  const [hydrating, setHydrating] = (0, import_react10.useState)(false);
+  const [error, setError] = (0, import_react10.useState)("");
+  const [copiedId, setCopiedId] = (0, import_react10.useState)(null);
+  const [launcherSide, setLauncherSide] = (0, import_react10.useState)("right");
+  const [launcherPosition, setLauncherPosition] = (0, import_react10.useState)(null);
+  const [draggingLauncher, setDraggingLauncher] = (0, import_react10.useState)(false);
+  const scrollerRef = (0, import_react10.useRef)(null);
+  const launcherRef = (0, import_react10.useRef)(null);
+  const launcherSideRef = (0, import_react10.useRef)("right");
+  const launcherPositionRef = (0, import_react10.useRef)(null);
+  const launcherDragRef = (0, import_react10.useRef)(null);
+  const suppressLauncherClickRef = (0, import_react10.useRef)(false);
+  const pendingPromptRef = (0, import_react10.useRef)(null);
+  (0, import_react10.useEffect)(() => {
+    const launcher = launcherRef.current;
+    if (!launcher) return;
+    let side = "right";
+    let desiredY = window.innerHeight - launcher.offsetHeight - 20;
+    try {
+      const stored = JSON.parse(
+        localStorage.getItem(LAUNCHER_STORAGE_KEY) || "null"
+      );
+      if ((stored == null ? void 0 : stored.side) === "left" || (stored == null ? void 0 : stored.side) === "right")
+        side = stored.side;
+      if (typeof (stored == null ? void 0 : stored.y) === "number") desiredY = stored.y;
+    } catch (e) {
+    }
+    launcherSideRef.current = side;
+    setLauncherSide(side);
+    const placeLauncher = () => {
+      var _a, _b;
+      const element = launcherRef.current;
+      if (!element) return;
+      const next = resolveSuiteAiLauncherPosition(
+        launcherSideRef.current,
+        (_b = (_a = launcherPositionRef.current) == null ? void 0 : _a.y) != null ? _b : desiredY,
+        window.innerWidth,
+        window.innerHeight,
+        element.offsetWidth,
+        element.offsetHeight
+      );
+      launcherPositionRef.current = next;
+      setLauncherPosition(next);
+    };
+    placeLauncher();
+    window.addEventListener("resize", placeLauncher);
+    return () => window.removeEventListener("resize", placeLauncher);
+  }, []);
+  const scrollToBottom = (0, import_react10.useCallback)(() => {
     const el = scrollerRef.current;
     if (!el) return;
     el.scrollTop = el.scrollHeight;
   }, []);
-  const hydrate = (0, import_react8.useCallback)(async () => {
+  const hydrate = (0, import_react10.useCallback)(async () => {
     var _a;
     setHydrating(true);
     setError("");
@@ -2361,7 +2503,7 @@ function SuiteAiPanel({
       setHydrating(false);
     }
   }, [fetchChat]);
-  (0, import_react8.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     function onOpen(event) {
       var _a;
       const detail = event.detail;
@@ -2374,7 +2516,7 @@ function SuiteAiPanel({
     window.addEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
     return () => window.removeEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
   }, []);
-  (0, import_react8.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (!open) return;
     void hydrate().then(() => {
       const pending = pendingPromptRef.current;
@@ -2384,7 +2526,7 @@ function SuiteAiPanel({
       }
     });
   }, [open, hydrate]);
-  (0, import_react8.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (open) scrollToBottom();
   }, [messages, loading, open, scrollToBottom]);
   async function ask(text) {
@@ -2433,24 +2575,137 @@ function SuiteAiPanel({
     } catch (e) {
     }
   }
+  function saveLauncherPosition(side, position) {
+    try {
+      localStorage.setItem(
+        LAUNCHER_STORAGE_KEY,
+        JSON.stringify({ side, y: position.y })
+      );
+    } catch (e) {
+    }
+  }
+  function dockLauncher(side, desiredY) {
+    const launcher = launcherRef.current;
+    if (!launcher) return;
+    const next = resolveSuiteAiLauncherPosition(
+      side,
+      desiredY,
+      window.innerWidth,
+      window.innerHeight,
+      launcher.offsetWidth,
+      launcher.offsetHeight
+    );
+    launcherSideRef.current = side;
+    launcherPositionRef.current = next;
+    setLauncherSide(side);
+    setLauncherPosition(next);
+    saveLauncherPosition(side, next);
+  }
+  function startLauncherDrag(event) {
+    if (event.pointerType === "mouse" && event.button !== 0) return;
+    const rect = event.currentTarget.getBoundingClientRect();
+    launcherDragRef.current = {
+      pointerId: event.pointerId,
+      offsetX: event.clientX - rect.left,
+      offsetY: event.clientY - rect.top,
+      startX: event.clientX,
+      startY: event.clientY
+    };
+    suppressLauncherClickRef.current = false;
+    event.currentTarget.setPointerCapture(event.pointerId);
+    setDraggingLauncher(true);
+  }
+  function moveLauncher(event) {
+    const drag = launcherDragRef.current;
+    if (!drag || drag.pointerId !== event.pointerId) return;
+    const launcher = event.currentTarget;
+    const maxX = Math.max(
+      LAUNCHER_EDGE_GAP,
+      window.innerWidth - launcher.offsetWidth - LAUNCHER_EDGE_GAP
+    );
+    const maxY = Math.max(
+      LAUNCHER_EDGE_GAP,
+      window.innerHeight - launcher.offsetHeight - LAUNCHER_EDGE_GAP
+    );
+    const next = {
+      x: Math.min(
+        Math.max(event.clientX - drag.offsetX, LAUNCHER_EDGE_GAP),
+        maxX
+      ),
+      y: Math.min(
+        Math.max(event.clientY - drag.offsetY, LAUNCHER_EDGE_GAP),
+        maxY
+      )
+    };
+    if (Math.hypot(event.clientX - drag.startX, event.clientY - drag.startY) > 4) {
+      suppressLauncherClickRef.current = true;
+    }
+    launcherPositionRef.current = next;
+    setLauncherPosition(next);
+  }
+  function finishLauncherDrag(event) {
+    var _a, _b, _c, _d;
+    const drag = launcherDragRef.current;
+    if (!drag || drag.pointerId !== event.pointerId) return;
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+    launcherDragRef.current = null;
+    setDraggingLauncher(false);
+    const rect = event.currentTarget.getBoundingClientRect();
+    const currentX = (_b = (_a = launcherPositionRef.current) == null ? void 0 : _a.x) != null ? _b : rect.left;
+    const side = currentX + rect.width / 2 < window.innerWidth / 2 ? "left" : "right";
+    dockLauncher(side, (_d = (_c = launcherPositionRef.current) == null ? void 0 : _c.y) != null ? _d : rect.top);
+  }
+  function moveLauncherWithKeyboard(event) {
+    var _a, _b;
+    if (!["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"].includes(event.key))
+      return;
+    event.preventDefault();
+    const currentY = (_b = (_a = launcherPositionRef.current) == null ? void 0 : _a.y) != null ? _b : event.currentTarget.getBoundingClientRect().top;
+    if (event.key === "ArrowLeft") dockLauncher("left", currentY);
+    else if (event.key === "ArrowRight") dockLauncher("right", currentY);
+    else
+      dockLauncher(
+        launcherSideRef.current,
+        currentY + (event.key === "ArrowUp" ? -24 : 24)
+      );
+  }
   const Icon = BrandIcon != null ? BrandIcon : import_iconoir_react8.Sparks;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-    !hideLauncher ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-      "button",
-      {
-        type: "button",
-        "data-test": "ai-panel-launcher",
-        onClick: () => setOpen(true),
-        className: "fixed bottom-5 right-5 z-30 flex items-center gap-2 rounded-full border border-ph-border bg-ph-surface px-4 py-2.5 text-sm font-medium text-ph-ink shadow-ph hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
-        "aria-label": "Open Ask AI",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Icon, { className: "h-4 w-4 text-ph-brand" }),
-          "Ask AI"
-        ]
-      }
-    ) : null,
-    open ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    !hideLauncher ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+        "button",
+        {
+          ref: launcherRef,
+          type: "button",
+          "data-test": "ai-panel-launcher",
+          onClick: () => {
+            if (suppressLauncherClickRef.current) {
+              suppressLauncherClickRef.current = false;
+              return;
+            }
+            setOpen(true);
+          },
+          onPointerDown: startLauncherDrag,
+          onPointerMove: moveLauncher,
+          onPointerUp: finishLauncherDrag,
+          onPointerCancel: finishLauncherDrag,
+          onKeyDown: moveLauncherWithKeyboard,
+          className: `fixed z-30 flex touch-none select-none items-center gap-2 rounded-full border border-ph-border bg-ph-surface px-4 py-2.5 text-sm font-medium text-ph-ink shadow-ph hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand ${draggingLauncher ? "cursor-grabbing" : "cursor-grab"}`,
+          style: launcherPosition ? { left: launcherPosition.x, top: launcherPosition.y } : { bottom: 20, right: 20 },
+          "aria-label": "Open Ask AI",
+          "aria-describedby": "suite-ask-ai-launcher-help",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Icon, { className: "h-4 w-4 text-ph-brand" }),
+            "Ask AI"
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { id: "suite-ask-ai-launcher-help", className: "sr-only", children: "Drag to reposition, or use arrow keys. The launcher docks to the nearest screen edge." })
+    ] }) : null,
+    open ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "button",
         {
           type: "button",
@@ -2459,22 +2714,22 @@ function SuiteAiPanel({
           "aria-label": "Close Ask AI"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
         "aside",
         {
-          className: "absolute inset-y-0 right-0 flex w-full max-w-md flex-col border-l border-ph-border bg-ph-surface shadow-2xl",
+          className: `absolute inset-y-0 flex w-full max-w-md flex-col bg-ph-surface shadow-2xl ${launcherSide === "left" ? "left-0 border-r border-ph-border" : "right-0 border-l border-ph-border"}`,
           "data-test": "suite-ask-ai-panel",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "min-w-0", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Icon, { className: "h-4 w-4 shrink-0 text-ph-brand" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: title })
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Icon, { className: "h-4 w-4 shrink-0 text-ph-brand" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: title })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "mt-0.5 text-[11px] text-ph-mutedtext", children: "Shared across your suite \xB7 same chat in every app" })
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "mt-0.5 text-[11px] text-ph-mutedtext", children: "Shared across your suite \xB7 same chat in every app" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-1", children: [
-                messages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-1", children: [
+                messages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
                   "button",
                   {
                     type: "button",
@@ -2485,19 +2740,19 @@ function SuiteAiPanel({
                     children: "Clear"
                   }
                 ) : null,
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
                   "button",
                   {
                     type: "button",
                     onClick: () => setOpen(false),
                     className: "rounded p-1 hover:bg-ph-muted",
                     "aria-label": "Close",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
                   }
                 )
               ] })
             ] }),
-            presets.length > 0 && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            presets.length > 0 && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
               "button",
               {
                 type: "button",
@@ -2508,38 +2763,44 @@ function SuiteAiPanel({
               },
               preset.label
             )) }) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
               "div",
               {
                 ref: scrollerRef,
                 className: "flex-1 space-y-3 overflow-y-auto p-4",
                 children: [
-                  error ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }) : null,
-                  hydrating && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
+                  error ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }) : null,
+                  hydrating && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
                     "Loading chat\u2026"
                   ] }) : null,
-                  !hydrating && messages.length === 0 && !error ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "mt-10 px-2 text-center", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "font-display text-base font-semibold text-ph-ink", children: "How can I help?" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "mt-2 text-sm leading-relaxed text-ph-subtle", children: emptyState })
+                  !hydrating && messages.length === 0 && !error ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "mt-10 px-2 text-center", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "font-display text-base font-semibold text-ph-ink", children: "How can I help?" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "mt-2 text-sm leading-relaxed text-ph-subtle", children: emptyState })
                   ] }) : null,
                   messages.map((message, index) => {
                     const isUser = message.role === "user";
-                    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
                       "div",
                       {
                         className: isUser ? "ml-8 rounded-2xl bg-ph-brand/10 px-3.5 py-2.5 text-sm text-ph-ink" : "mr-4 rounded-2xl bg-ph-muted px-3.5 py-2.5 text-sm text-ph-ink",
                         "data-test": isUser ? "ask-ai-user" : "ask-ai-assistant",
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "whitespace-pre-wrap", children: message.content }),
-                          !isUser ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+                          isUser ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "whitespace-pre-wrap", children: message.content }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                            import_react10.Suspense,
+                            {
+                              fallback: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "whitespace-pre-wrap", children: message.content }),
+                              children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SuiteAiBlockNoteMessage2, { markdown: message.content })
+                            }
+                          ),
+                          !isUser ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
                             "button",
                             {
                               type: "button",
                               onClick: () => void copyMessage(index, message.content),
                               className: "mt-2 inline-flex items-center gap-1 text-xs text-ph-mutedtext hover:text-ph-ink",
                               children: [
-                                copiedId === index ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
+                                copiedId === index ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
                                 copiedId === index ? "Copied" : "Copy"
                               ]
                             }
@@ -2549,15 +2810,15 @@ function SuiteAiPanel({
                       `${message.role}-${index}-${message.content.slice(0, 24)}`
                     );
                   }),
-                  loading ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
+                  loading ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
                     "Thinking\u2026"
                   ] }) : null
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
                 "textarea",
                 {
                   value: prompt,
@@ -2575,7 +2836,7 @@ function SuiteAiPanel({
                   className: "flex-1 resize-none rounded-xl border border-ph-border bg-ph-canvas p-2.5 text-sm text-ph-ink outline-none focus:ring-1 focus:ring-ph-brand"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
                 "button",
                 {
                   type: "button",
@@ -2595,7 +2856,7 @@ function SuiteAiPanel({
 }
 
 // src/suite/lib/use-sidebar-width.ts
-var import_react9 = require("react");
+var import_react11 = require("react");
 var SIDEBAR_RAIL_WIDTH = 56;
 var SIDEBAR_COLLAPSE_THRESHOLD = 80;
 var SIDEBAR_MIN_EXPANDED_WIDTH = 180;
@@ -2610,10 +2871,10 @@ function snapWidth(width) {
   return Math.min(SIDEBAR_MAX_WIDTH, width);
 }
 function useSidebarWidth(storageKey) {
-  const [width, setWidth] = (0, import_react9.useState)(SIDEBAR_DEFAULT_WIDTH);
-  const [narrowViewport, setNarrowViewport] = (0, import_react9.useState)(false);
+  const [width, setWidth] = (0, import_react11.useState)(SIDEBAR_DEFAULT_WIDTH);
+  const [narrowViewport, setNarrowViewport] = (0, import_react11.useState)(false);
   const collapsed = narrowViewport || width <= SIDEBAR_COLLAPSE_THRESHOLD;
-  (0, import_react9.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     let stored = null;
     try {
       stored = localStorage.getItem(storageKey);
@@ -2625,14 +2886,14 @@ function useSidebarWidth(storageKey) {
       queueMicrotask(() => setWidth(snapWidth(clampWidth(parsed))));
     }
   }, [storageKey]);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     const media = window.matchMedia("(max-width: 639px)");
     const sync = () => setNarrowViewport(media.matches);
     sync();
     media.addEventListener("change", sync);
     return () => media.removeEventListener("change", sync);
   }, []);
-  const persist = (0, import_react9.useCallback)(
+  const persist = (0, import_react11.useCallback)(
     (value) => {
       try {
         localStorage.setItem(storageKey, String(value));
@@ -2641,7 +2902,7 @@ function useSidebarWidth(storageKey) {
     },
     [storageKey]
   );
-  const setCollapsed = (0, import_react9.useCallback)(
+  const setCollapsed = (0, import_react11.useCallback)(
     (value) => {
       setWidth((current) => {
         const next = value ? SIDEBAR_RAIL_WIDTH : current <= SIDEBAR_COLLAPSE_THRESHOLD ? SIDEBAR_DEFAULT_WIDTH : snapWidth(current);
@@ -2651,11 +2912,11 @@ function useSidebarWidth(storageKey) {
     },
     [persist]
   );
-  const resetWidth = (0, import_react9.useCallback)(() => {
+  const resetWidth = (0, import_react11.useCallback)(() => {
     setWidth(SIDEBAR_DEFAULT_WIDTH);
     persist(SIDEBAR_DEFAULT_WIDTH);
   }, [persist]);
-  const startResize = (0, import_react9.useCallback)(
+  const startResize = (0, import_react11.useCallback)(
     (event) => {
       event.preventDefault();
       const startX = event.clientX;
@@ -2681,10 +2942,10 @@ function useSidebarWidth(storageKey) {
 }
 
 // src/suite/lib/motion.tsx
-var import_react10 = require("motion/react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_react12 = require("motion/react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function SuiteMotionProvider({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react10.LazyMotion, { features: import_react10.domAnimation, strict: true, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react12.LazyMotion, { features: import_react12.domAnimation, strict: true, children });
 }
 var SUITE_SPRINGS = {
   /** Snappy panel/sheet entrances — small overshoot. */
@@ -2696,24 +2957,24 @@ var SUITE_SPRINGS = {
 };
 
 // src/suite/components/suite-skeleton.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function SuiteSkeleton({
   className,
   lines = 1,
   circle,
   width
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "div",
     {
       className: cn("space-y-2", circle ? "flex flex-col items-center" : ""),
       "aria-hidden": true,
-      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
         "div",
         {
           className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
           style: { animationDelay: `${index * 80}ms` },
-          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             "div",
             {
               className: cn(
@@ -2737,7 +2998,7 @@ function SuiteSkeletonCard({
   rows = 3,
   header = true
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
       className: cn(
@@ -2746,26 +3007,26 @@ function SuiteSkeletonCard({
       ),
       "aria-hidden": true,
       children: [
-        header ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+        header ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
           "div",
           {
             className: "mb-5 flex items-center gap-3 animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: "100ms" },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
-              /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 space-y-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 space-y-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
               ] })
             ]
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           "div",
           {
             className: "animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: `${200 + index * 80}ms` },
-            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
               "div",
               {
                 className: "ph-skeleton h-3",
@@ -2783,16 +3044,16 @@ function SuiteSkeletonList({
   className,
   items = 4
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "div",
     {
       className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
       style: { animationDelay: `${index * 100}ms` },
-      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border bg-ph-surface p-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border bg-ph-surface p-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
         ] })
       ] })
     },
@@ -2807,7 +3068,7 @@ function SuiteEmptyState({
   className,
   size = "md"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
       className: cn(
@@ -2816,13 +3077,13 @@ function SuiteEmptyState({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative", children: [
-          icon ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "relative", children: [
+          icon ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             "h3",
             {
               className: cn(
@@ -2832,8 +3093,8 @@ function SuiteEmptyState({
               children: title
             }
           ),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
-          action ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
+          description ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
+          action ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
         ] })
       ]
     }
@@ -2841,8 +3102,8 @@ function SuiteEmptyState({
 }
 
 // src/suite/components/suite-settings-mobile-nav.tsx
-var import_react11 = require("react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_react13 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function SuiteSettingsMobileNav({
   items,
   activeHref,
@@ -2851,16 +3112,16 @@ function SuiteSettingsMobileNav({
   ariaLabel = "Settings sections",
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "nav",
     {
       "data-test": dataTest,
       "aria-label": ariaLabel,
       className: cn("suite-settings-mobile-nav lg:hidden", className),
-      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
+      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
         const Icon = item.icon;
         const active = activeHref === item.href || activeHref.startsWith(`${item.href}/`);
-        const iconNode = (0, import_react11.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        const iconNode = (0, import_react13.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           Icon,
           {
             className: cn(
@@ -2870,7 +3131,7 @@ function SuiteSettingsMobileNav({
             "aria-hidden": true
           }
         );
-        return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
           "button",
           {
             type: "button",
@@ -2884,8 +3145,8 @@ function SuiteSettingsMobileNav({
             ),
             children: [
               iconNode,
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
-              active ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
+              active ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
             ]
           },
           item.href
@@ -2899,10 +3160,10 @@ function SuiteSettingsMobileNav({
 var import_link2 = __toESM(require("next/link"));
 
 // src/components/ui/Tooltip.tsx
-var import_react12 = require("react");
+var import_react14 = require("react");
 var import_react_dom = require("react-dom");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var TooltipDelayContext = (0, import_react12.createContext)(0);
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var TooltipDelayContext = (0, import_react14.createContext)(0);
 function tooltipPosition(trigger, side, align, offset) {
   const horizontal = align === "start" ? trigger.left : align === "end" ? trigger.right : trigger.left + trigger.width / 2;
   const vertical = align === "start" ? trigger.top : align === "end" ? trigger.bottom : trigger.top + trigger.height / 2;
@@ -2942,12 +3203,12 @@ function Tooltip({
   onOpenChange,
   delayDuration
 }) {
-  const providerDelay = (0, import_react12.useContext)(TooltipDelayContext);
-  const generatedId = (0, import_react12.useId)().replace(/:/g, "");
-  const triggerRef = (0, import_react12.useRef)(null);
-  const timerRef = (0, import_react12.useRef)(null);
-  const [internalOpen, setInternalOpen] = (0, import_react12.useState)(defaultOpen);
-  const [position, setPosition] = (0, import_react12.useState)(null);
+  const providerDelay = (0, import_react14.useContext)(TooltipDelayContext);
+  const generatedId = (0, import_react14.useId)().replace(/:/g, "");
+  const triggerRef = (0, import_react14.useRef)(null);
+  const timerRef = (0, import_react14.useRef)(null);
+  const [internalOpen, setInternalOpen] = (0, import_react14.useState)(defaultOpen);
+  const [position, setPosition] = (0, import_react14.useState)(null);
   const isOpen = open != null ? open : internalOpen;
   const triggerId = children.props.id;
   const tooltipId = triggerId ? `${triggerId}-tooltip` : `ph-tooltip-${generatedId}`;
@@ -2981,7 +3242,7 @@ function Tooltip({
     clearTimer();
     setOpen(false);
   }
-  (0, import_react12.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (!isOpen) return;
     const reposition = () => updatePosition();
     window.addEventListener("resize", reposition);
@@ -2991,11 +3252,11 @@ function Tooltip({
       window.removeEventListener("scroll", reposition, true);
     };
   });
-  (0, import_react12.useEffect)(() => () => clearTimer(), []);
+  (0, import_react14.useEffect)(() => () => clearTimer(), []);
   const describedBy = [children.props["aria-describedby"], tooltipId].filter(Boolean).join(" ");
-  const trigger = (0, import_react12.cloneElement)(children, { "aria-describedby": describedBy });
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  const trigger = (0, import_react14.cloneElement)(children, { "aria-describedby": describedBy });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "span",
       {
         ref: triggerRef,
@@ -3011,12 +3272,12 @@ function Tooltip({
       }
     ),
     isOpen && position && typeof document !== "undefined" ? (0, import_react_dom.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         "span",
         {
           style: __spreadValues({ position: "fixed" }, position),
           className: "pointer-events-none z-[200]",
-          children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "span",
             {
               id: tooltipId,
@@ -3034,7 +3295,7 @@ function Tooltip({
 }
 
 // src/suite/components/suite-sidebar.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function renderNode(node, collapsed) {
   if (typeof node === "function") return node(collapsed);
   return node;
@@ -3051,7 +3312,7 @@ function SuiteSidebar({
   className,
   surface = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "div",
     {
       className: cn(
@@ -3060,7 +3321,7 @@ function SuiteSidebar({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
           "div",
           {
             className: cn(
@@ -3069,12 +3330,12 @@ function SuiteSidebar({
               collapsed ? "flex-col items-center gap-1 px-1 py-2" : "h-14 items-center justify-between gap-2 px-3"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
-              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
+              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
           "div",
           {
             className: cn(
@@ -3083,17 +3344,17 @@ function SuiteSidebar({
               collapsed ? "px-1.5 py-2" : "p-2"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
                 "nav",
                 {
                   "aria-label": "Pages",
                   className: "shrink-0 space-y-0.5",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
+                    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
                       const Icon = item.icon;
                       const active = Boolean(item.active);
-                      const link = /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+                      const link = /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
                         import_link2.default,
                         {
                           href: item.href,
@@ -3106,7 +3367,7 @@ function SuiteSidebar({
                             collapsed ? "mx-auto size-10 shrink-0 justify-center gap-0 px-0 py-0" : "w-full px-2.5 py-2"
                           ),
                           children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -3114,7 +3375,7 @@ function SuiteSidebar({
                                   item.iconClassName
                                 ),
                                 "aria-hidden": true,
-                                children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                                children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                                   Icon,
                                   {
                                     className: "h-full w-full",
@@ -3123,7 +3384,7 @@ function SuiteSidebar({
                                 )
                               }
                             ),
-                            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -3134,17 +3395,17 @@ function SuiteSidebar({
                                 children: item.label
                               }
                             ),
-                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
+                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
                           ]
                         },
                         item.label
                       );
-                      return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
+                      return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
                     }) })
                   ]
                 }
               ),
-              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                 "div",
                 {
                   className: "min-h-0 flex-1",
@@ -3155,7 +3416,7 @@ function SuiteSidebar({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           "div",
           {
             className: cn(
@@ -3163,7 +3424,7 @@ function SuiteSidebar({
               surface ? "bg-ph-surface" : "bg-ph-canvas",
               collapsed ? "p-1.5" : "p-3"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
               "div",
               {
                 className: cn(
@@ -3172,7 +3433,7 @@ function SuiteSidebar({
                 ),
                 children: [
                   renderNode(userMenu, collapsed),
-                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
+                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
                 ]
               }
             )
@@ -3184,7 +3445,7 @@ function SuiteSidebar({
 }
 
 // src/suite/components/suite-app-layout.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function SuiteAppLayout({
   sidebar,
   children,
@@ -3197,13 +3458,13 @@ function SuiteAppLayout({
   onResetWidth,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       "data-test": "app-shell",
       className: cn("flex min-h-dvh lg:h-screen lg:overflow-hidden", className),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
           "aside",
           {
             className: "relative hidden shrink-0 flex-col overflow-hidden border-r border-ph-border transition-[width] duration-200 ease-out lg:flex",
@@ -3211,7 +3472,7 @@ function SuiteAppLayout({
             "data-collapsed": collapsed ? "true" : "false",
             children: [
               sidebar,
-              onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+              onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
                 "div",
                 {
                   role: "separator",
@@ -3225,9 +3486,9 @@ function SuiteAppLayout({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: [
-          mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "shrink-0 lg:hidden", children: mobileHeader }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: [
+          mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "shrink-0 lg:hidden", children: mobileHeader }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             "main",
             {
               id: "main-content",
@@ -3240,7 +3501,7 @@ function SuiteAppLayout({
               children
             }
           ),
-          bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "shrink-0 lg:hidden", children: bottomNav }) : null
+          bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "shrink-0 lg:hidden", children: bottomNav }) : null
         ] })
       ]
     }