@arbidocs/blocks 0.3.185 → 0.4.1

package/dist/chunk-7PEELPMA.js

@@ -0,0 +1,1799 @@
+"use client";
+import { ActionLink } from './chunk-S7PSMMRG.js';
+import { BlocksTooltipProvider } from './chunk-YDHO4AVL.js';
+import { testIdOr, prefixedTestId } from './chunk-7F6CBP3Z.js';
+import { createContext, forwardRef, useContext, useRef, useEffect, useCallback, useMemo, useState, useId } from 'react';
+import { X, PanelLeft, PanelLeftClose, PanelLeftOpen, Globe, Users, Lock, ChevronDown, LayoutGrid, Plus, Sparkles, Search, ArrowUp, Menu, TriangleAlert, CheckCircle2, Loader2, RefreshCw, WifiOff, MousePointerClick, Lightbulb, Pencil, ChevronLeft, ChevronRight, Info } from 'lucide-react';
+import { cn, Tooltip, TooltipTrigger, TooltipContent, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuLabel, Button } from '@arbidocs/react/ui';
+export { UserMenu } from '@arbidocs/react/ui';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+export { NotificationBell } from '@arbidocs/react/shell';
+
+var FOCUSABLE = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
+function focusableIn(container) {
+  return Array.from(container.querySelectorAll(FOCUSABLE)).filter(
+    (el) => !el.closest("[inert]") && el.getAttribute("aria-hidden") !== "true"
+  );
+}
+function useDrawerBehavior(isOpen, onClose, containerRef) {
+  const onCloseRef = useRef(onClose);
+  useEffect(() => {
+    onCloseRef.current = onClose;
+  });
+  useEffect(() => {
+    if (!isOpen) return;
+    const previousOverflow = document.body.style.overflow;
+    const opener = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    document.body.style.overflow = "hidden";
+    const container = containerRef?.current ?? null;
+    if (container) {
+      const first = focusableIn(container)[0];
+      if (first) first.focus();
+      else {
+        if (!container.hasAttribute("tabindex")) container.setAttribute("tabindex", "-1");
+        container.focus();
+      }
+    }
+    const onKey = (e) => {
+      if (e.key === "Escape") {
+        onCloseRef.current();
+        return;
+      }
+      if (e.key !== "Tab" || !container) return;
+      const items = focusableIn(container);
+      if (items.length === 0) {
+        e.preventDefault();
+        return;
+      }
+      const firstItem = items[0];
+      const lastItem = items[items.length - 1];
+      const active = document.activeElement;
+      if (!container.contains(active)) {
+        e.preventDefault();
+        firstItem.focus();
+      } else if (e.shiftKey && active === firstItem) {
+        e.preventDefault();
+        lastItem.focus();
+      } else if (!e.shiftKey && active === lastItem) {
+        e.preventDefault();
+        firstItem.focus();
+      }
+    };
+    window.addEventListener("keydown", onKey);
+    return () => {
+      document.body.style.overflow = previousOverflow;
+      window.removeEventListener("keydown", onKey);
+      if (opener?.isConnected) opener.focus();
+    };
+  }, [isOpen, containerRef]);
+}
+var DEFAULT_OVERLAY_ZONE_ID = "app-overlay-zone";
+var OverlayZoneContext = createContext(DEFAULT_OVERLAY_ZONE_ID);
+function useOverlayZoneId() {
+  return useContext(OverlayZoneContext);
+}
+function ShellRoot({
+  banner,
+  topbar,
+  sidebar,
+  tabBar,
+  aside,
+  overlays,
+  children,
+  className,
+  "data-testid": testId
+}) {
+  return /* @__PURE__ */ jsx(BlocksTooltipProvider, { children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "shell",
+      "data-testid": testId,
+      className: cn("flex h-screen flex-col", className),
+      children: [
+        banner,
+        topbar,
+        /* @__PURE__ */ jsxs("div", { className: "relative flex flex-1 overflow-hidden", children: [
+          sidebar,
+          children,
+          aside,
+          overlays
+        ] }),
+        tabBar
+      ]
+    }
+  ) });
+}
+function ShellContent({
+  children,
+  scrollRef,
+  onClick,
+  overlayZoneId = DEFAULT_OVERLAY_ZONE_ID,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "shell-content",
+      className: cn("flex min-w-0 flex-1 flex-col", className),
+      onClick,
+      children: /* @__PURE__ */ jsxs("div", { className: "relative min-h-0 flex-1", children: [
+        /* @__PURE__ */ jsx(OverlayZoneContext.Provider, { value: overlayZoneId, children: /* @__PURE__ */ jsx("div", { ref: scrollRef, className: "h-full overflow-auto", children }) }),
+        /* @__PURE__ */ jsx("div", { id: overlayZoneId, "data-slot": "overlay-zone" })
+      ] })
+    }
+  );
+}
+function ShellTopbar({ children, actions, className }) {
+  return (
+    // `relative z-30` keeps dropdowns the header opens above the page region (a later sibling).
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "shell-topbar",
+        className: cn("relative z-30 flex h-14 shrink-0 items-center bg-background px-2", className),
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "mx-auto flex w-full max-w-6xl items-center", children: /* @__PURE__ */ jsx("div", { className: "hidden min-w-0 flex-1 px-6 sm:block", children }) }),
+          /* @__PURE__ */ jsx("div", { className: "absolute right-4 top-1/2 flex -translate-y-1/2 items-center gap-1", children: actions })
+        ]
+      }
+    )
+  );
+}
+function ShellDock({
+  isOpen,
+  onOpenChange,
+  width = "24rem",
+  isMobile = false,
+  label,
+  closeLabel = "Close",
+  children,
+  className,
+  "data-testid": testId
+}) {
+  const mobileRef = useRef(null);
+  const closeMobile = useCallback(() => onOpenChange?.(false), [onOpenChange]);
+  useDrawerBehavior(isOpen && isMobile, closeMobile, mobileRef);
+  if (!isOpen) return null;
+  if (isMobile) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: mobileRef,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": label,
+        "data-slot": "shell-dock",
+        "data-state": "open",
+        "data-mobile": "true",
+        "data-testid": testId,
+        className: cn("fixed inset-0 z-40 flex flex-col bg-background", className),
+        children: [
+          onOpenChange && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onOpenChange(false),
+              "aria-label": closeLabel,
+              className: "absolute right-2 top-2 z-10 rounded-md p-2 text-muted-foreground hover:bg-muted",
+              children: /* @__PURE__ */ jsx(X, { className: "size-5" })
+            }
+          ),
+          children
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "aside",
+    {
+      "aria-label": label,
+      "data-slot": "shell-dock",
+      "data-state": "open",
+      "data-testid": testId,
+      style: { width },
+      className: cn(
+        "flex shrink-0 flex-col overflow-hidden border-l border-border bg-background",
+        className
+      ),
+      children
+    }
+  );
+}
+var Shell = {
+  Root: ShellRoot,
+  Content: ShellContent,
+  Topbar: ShellTopbar,
+  Dock: ShellDock
+};
+var DEFAULT_PAGE_CONTAINER_PADDING = "px-4 sm:px-6 lg:px-8";
+function PageContainer({
+  children,
+  wide = false,
+  minScreen = false,
+  maxWidth = "max-w-6xl",
+  padding = DEFAULT_PAGE_CONTAINER_PADDING,
+  innerClassName,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "page-container",
+      className: cn(
+        "bg-background pb-safe",
+        minScreen ? "min-h-screen" : "h-full min-h-0",
+        className
+      ),
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "flex h-full w-full flex-col pb-safe",
+            padding,
+            !wide && cn("mx-auto", maxWidth),
+            innerClassName
+          ),
+          children
+        }
+      )
+    }
+  );
+}
+var DEFAULT_SIDEBAR_TOGGLE_BUTTON_LABELS = {
+  closeSidebar: "Close sidebar",
+  openSidebar: "Open sidebar"
+};
+function SidebarToggleButton({
+  isOpen,
+  onToggle,
+  labels,
+  "data-testid": testId = "tabheader-sidebar-toggle"
+}) {
+  const l = { ...DEFAULT_SIDEBAR_TOGGLE_BUTTON_LABELS, ...labels };
+  const label = isOpen ? l.closeSidebar : l.openSidebar;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: onToggle,
+      className: "rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground pointer-coarse:p-2.5",
+      "aria-label": label,
+      title: label,
+      "data-testid": testId,
+      children: /* @__PURE__ */ jsx(PanelLeft, { className: "size-5" })
+    }
+  );
+}
+var DEFAULT_SIDEBAR_LABELS = {
+  mainNavigation: "Main navigation",
+  hideSidebar: "Hide sidebar",
+  showSidebar: "Show sidebar",
+  closeNavigationMenu: "Close navigation menu"
+};
+var SidebarContext = createContext({
+  expanded: true,
+  labels: DEFAULT_SIDEBAR_LABELS
+});
+var useSidebarContext = () => useContext(SidebarContext);
+var SidebarRowHoverContext = createContext(false);
+var SidebarBadgeRow = forwardRef(
+  function SidebarBadgeRow2({ icon, label, count, ariaLabel, variant, badgeTestId, className, type = "button", ...rest }, ref) {
+    const { expanded } = useSidebarContext();
+    const resolved = variant ?? (expanded ? "row" : "icon");
+    const hasCount = count !== void 0 && count > 0;
+    const badgeText = hasCount ? count > 9 ? "9+" : String(count) : null;
+    const name = ariaLabel ?? (hasCount ? `${label}, ${count}` : label);
+    if (resolved === "row") {
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          ref,
+          type,
+          "aria-label": name,
+          "data-slot": "sidebar-badge-row",
+          "data-variant": "row",
+          className: cn(
+            "group flex h-9 w-full cursor-pointer items-center rounded-md px-3 text-left text-sm font-medium text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:h-11",
+            className
+          ),
+          ...rest,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "flex size-5 flex-shrink-0 items-center justify-center", "aria-hidden": true, children: icon }),
+            /* @__PURE__ */ jsx("span", { className: "ml-3 min-w-0 truncate", "aria-hidden": true, children: label }),
+            badgeText && /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": true,
+                "data-testid": badgeTestId,
+                className: "ml-auto inline-flex min-w-5 flex-shrink-0 items-center justify-center rounded-full bg-primary px-1.5 text-xs font-semibold leading-5 tabular-nums text-primary-foreground",
+                children: badgeText
+              }
+            )
+          ]
+        }
+      );
+    }
+    const iconButton = /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type,
+        "aria-label": name,
+        "data-slot": "sidebar-badge-row",
+        "data-variant": "icon",
+        title: variant === "icon" ? label : void 0,
+        className: cn(
+          "relative m-0 flex h-9 w-12 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:h-11",
+          className
+        ),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "flex size-5 items-center justify-center", "aria-hidden": true, children: icon }),
+          badgeText && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "aria-hidden": true,
+              "data-testid": badgeTestId,
+              className: "absolute right-1 top-0.5 flex min-w-4 items-center justify-center rounded-full bg-primary px-1 text-xs font-semibold leading-4 tabular-nums text-primary-foreground",
+              children: badgeText
+            }
+          )
+        ]
+      }
+    );
+    if (variant === "icon") return iconButton;
+    return /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 50, children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: iconButton }),
+      /* @__PURE__ */ jsx(TooltipContent, { side: "right", sideOffset: 8, children: label })
+    ] });
+  }
+);
+var noop = () => {
+};
+var COLLAPSED_WIDTH = "64px";
+var EXPANDED_WIDTH = "256px";
+function SidebarRoot({
+  mode,
+  expanded,
+  isHovering = false,
+  isPeeking = false,
+  onBackdropClick,
+  hasRailBackdrop = false,
+  onMouseEnter,
+  onMouseLeave,
+  children,
+  className,
+  "aria-label": ariaLabelProp,
+  labels,
+  "data-testid": testId,
+  backdropTestId
+}) {
+  const mergedLabels = useMemo(() => ({ ...DEFAULT_SIDEBAR_LABELS, ...labels }), [labels]);
+  const drawerRef = useRef(null);
+  const isDrawer = mode === "drawer";
+  useDrawerBehavior(isDrawer, onBackdropClick ?? noop, drawerRef);
+  const ariaLabel = ariaLabelProp ?? mergedLabels.mainNavigation;
+  const contextValue = useMemo(() => ({ expanded, labels: mergedLabels }), [expanded, mergedLabels]);
+  const navBase = "group/sidebar bg-sidebar border-r border-border text-foreground flex flex-col h-full overflow-y-auto overflow-x-hidden pb-safe pt-3 transition-all duration-300 ease-in-out";
+  const common = {
+    "aria-label": ariaLabel,
+    "data-testid": testIdOr(testId, { testId: "sidebar" }),
+    "data-slot": "sidebar",
+    "data-mode": mode
+  };
+  const fixedWidth = { width: EXPANDED_WIDTH, minWidth: EXPANDED_WIDTH };
+  let body;
+  if (mode === "drawer") {
+    body = /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: drawerRef,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": ariaLabel,
+        "data-slot": "sidebar-drawer",
+        className: "fixed inset-0 z-50",
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "absolute inset-0 bg-black/50",
+              onClick: onBackdropClick,
+              "aria-hidden": "true",
+              "data-testid": testIdOr(backdropTestId, { testId: "sidebar-backdrop" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "nav",
+            {
+              ...common,
+              className: cn(navBase, "!px-3 absolute left-0 top-0 pt-safe shadow-xl", className),
+              style: fixedWidth,
+              children
+            }
+          )
+        ]
+      }
+    );
+  } else if (mode === "collapsed") {
+    body = /* @__PURE__ */ jsx(
+      "nav",
+      {
+        ...common,
+        className: cn(navBase, "absolute left-0 top-0 z-[45]", isPeeking && "shadow-xl", className),
+        style: {
+          width: isPeeking ? EXPANDED_WIDTH : "0px",
+          minWidth: 0,
+          paddingLeft: isPeeking ? "0.75rem" : 0,
+          paddingRight: isPeeking ? "0.75rem" : 0,
+          borderRightWidth: isPeeking ? void 0 : 0,
+          pointerEvents: isPeeking ? "auto" : "none"
+        },
+        inert: !isPeeking,
+        onMouseEnter,
+        onMouseLeave,
+        children
+      }
+    );
+  } else if (mode === "pinned") {
+    body = /* @__PURE__ */ jsx(
+      "nav",
+      {
+        ...common,
+        className: cn(navBase, "!px-3 relative flex-shrink-0", className),
+        style: fixedWidth,
+        onMouseEnter,
+        onMouseLeave,
+        children
+      }
+    );
+  } else {
+    body = /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "bg-sidebar border-r border-border flex flex-col h-full relative px-0 pb-safe flex-shrink-0",
+          style: { width: COLLAPSED_WIDTH, minWidth: COLLAPSED_WIDTH },
+          "aria-hidden": "true"
+        }
+      ),
+      isHovering && hasRailBackdrop && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "fixed inset-0 z-[44] bg-black/40",
+          onClick: onBackdropClick,
+          "aria-hidden": "true",
+          "data-testid": testIdOr(backdropTestId, { testId: "sidebar-backdrop" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "nav",
+        {
+          ...common,
+          className: cn(
+            navBase,
+            isHovering ? "!px-3 shadow-xl" : "!px-2",
+            "absolute left-0 top-0 z-[45]",
+            className
+          ),
+          style: {
+            width: isHovering ? EXPANDED_WIDTH : COLLAPSED_WIDTH,
+            minWidth: isHovering ? EXPANDED_WIDTH : COLLAPSED_WIDTH
+          },
+          onMouseEnter,
+          onMouseLeave,
+          children
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(BlocksTooltipProvider, { children: body }) });
+}
+function SidebarHeader({ children, className, "data-testid": testId }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-header",
+      "data-testid": testId,
+      className: cn("flex flex-shrink-0 flex-col gap-3 pb-3", className),
+      children
+    }
+  );
+}
+function SidebarNav({ items, children, className, "data-testid": testId }) {
+  const { expanded } = useSidebarContext();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "sidebar-nav",
+      "data-testid": testId,
+      className: cn("flex flex-shrink-0 flex-col gap-0.5", !expanded && "items-center", className),
+      children: [
+        items?.map((item) => /* @__PURE__ */ jsx(SidebarNavItem, { ...item }, item.id)),
+        children
+      ]
+    }
+  );
+}
+function SidebarGroup({
+  label,
+  ariaLabel,
+  children,
+  className,
+  "data-testid": testId
+}) {
+  const { expanded } = useSidebarContext();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "group",
+      "aria-label": ariaLabel ?? (typeof label === "string" ? label : void 0),
+      "data-slot": "sidebar-group",
+      "data-testid": testId,
+      className: cn("flex flex-shrink-0 flex-col gap-0.5", !expanded && "items-center", className),
+      children: [
+        label && (expanded ? /* @__PURE__ */ jsx(SidebarGroupLabel, { children: label }) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            role: "separator",
+            "data-slot": "sidebar-group-divider",
+            className: "my-1 h-px w-6 bg-border"
+          }
+        )),
+        children
+      ]
+    }
+  );
+}
+function SidebarGroupLabel({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-group-label",
+      className: cn(
+        "px-2 pb-0.5 pt-2 text-xs font-medium uppercase tracking-wide text-muted-foreground",
+        className
+      ),
+      children
+    }
+  );
+}
+function SidebarFooter({ children, className, "data-testid": testId }) {
+  const { expanded } = useSidebarContext();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-footer",
+      "data-testid": testId,
+      className: cn(
+        "mt-auto flex flex-shrink-0 flex-col gap-2 pt-3 pb-3",
+        !expanded && "items-center",
+        className
+      ),
+      children
+    }
+  );
+}
+function SidebarNavItem({
+  label,
+  icon,
+  active = false,
+  onSelect,
+  href,
+  count,
+  countIcon,
+  testId,
+  disabled = false,
+  trailing,
+  className,
+  tooltip
+}) {
+  const { expanded } = useSidebarContext();
+  const [isRowActive, setIsRowActive] = useState(false);
+  const tip = expanded ? void 0 : tooltip ?? label;
+  if (!expanded) {
+    const railButton = /* @__PURE__ */ jsx(
+      ActionLink,
+      {
+        href,
+        onSelect,
+        disabled,
+        "aria-label": label,
+        "aria-current": active ? "page" : void 0,
+        "data-slot": "sidebar-nav-item",
+        "data-testid": testId,
+        className: cn(
+          "m-0 flex h-9 w-12 items-center justify-center rounded-md transition-colors pointer-coarse:h-11",
+          active ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-muted hover:text-foreground",
+          disabled && "pointer-events-none cursor-not-allowed opacity-30",
+          className
+        ),
+        children: /* @__PURE__ */ jsx("div", { className: "flex size-5 items-center justify-center", children: icon })
+      }
+    );
+    if (!tip) return railButton;
+    return /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 50, children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: railButton }),
+      /* @__PURE__ */ jsx(TooltipContent, { side: "right", sideOffset: 8, children: tip })
+    ] });
+  }
+  const rowClass = cn(
+    "group flex h-9 w-full cursor-pointer items-center rounded-md px-3 text-sm transition-colors pointer-coarse:h-11",
+    active ? "bg-accent font-semibold text-accent-foreground" : "font-medium text-muted-foreground hover:bg-muted hover:text-foreground",
+    disabled && "pointer-events-none cursor-not-allowed opacity-30",
+    className
+  );
+  const countNode = count !== void 0 && /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cn(
+        "ml-auto inline-flex flex-shrink-0 items-center gap-0.5 pl-2 text-xs font-normal tabular-nums",
+        active ? "text-accent-foreground" : "text-muted-foreground"
+      ),
+      children: [
+        countIcon,
+        count
+      ]
+    }
+  );
+  if (href && !disabled && !trailing) {
+    return /* @__PURE__ */ jsxs(
+      ActionLink,
+      {
+        href,
+        onSelect,
+        "aria-current": active ? "page" : void 0,
+        "data-slot": "sidebar-nav-item",
+        "data-testid": testId,
+        className: rowClass,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "flex size-5 flex-shrink-0 items-center justify-center", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "ml-3 min-w-0 truncate text-left", children: label }),
+          countNode
+        ]
+      }
+    );
+  }
+  if (href && !disabled) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        onMouseEnter: () => setIsRowActive(true),
+        onMouseLeave: () => setIsRowActive(false),
+        onFocusCapture: () => setIsRowActive(true),
+        onBlurCapture: (e) => {
+          if (!e.currentTarget.contains(e.relatedTarget)) setIsRowActive(false);
+        },
+        "data-slot": "sidebar-nav-item",
+        "data-testid": testId,
+        className: cn(rowClass, "relative"),
+        children: [
+          /* @__PURE__ */ jsx(
+            ActionLink,
+            {
+              href,
+              onSelect,
+              "aria-label": label,
+              "aria-current": active ? "page" : void 0,
+              className: "absolute inset-0 rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "pointer-events-none flex min-w-0 flex-1 items-center", children: [
+            /* @__PURE__ */ jsx("div", { className: "flex size-5 flex-shrink-0 items-center justify-center", children: icon }),
+            /* @__PURE__ */ jsx("span", { className: "ml-3 min-w-0 truncate text-left", children: label }),
+            countNode
+          ] }),
+          /* @__PURE__ */ jsx(SidebarRowHoverContext.Provider, { value: isRowActive, children: /* @__PURE__ */ jsx("span", { className: "relative ml-2 flex flex-shrink-0 items-center", children: trailing }) })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "button",
+      tabIndex: disabled ? -1 : 0,
+      "aria-current": active ? "page" : void 0,
+      onClick: disabled ? void 0 : onSelect,
+      onMouseEnter: () => setIsRowActive(true),
+      onMouseLeave: () => setIsRowActive(false),
+      onFocusCapture: () => setIsRowActive(true),
+      onBlurCapture: (e) => {
+        if (!e.currentTarget.contains(e.relatedTarget)) setIsRowActive(false);
+      },
+      onKeyDown: disabled ? void 0 : (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onSelect();
+        }
+      },
+      "data-slot": "sidebar-nav-item",
+      "data-testid": testId,
+      className: rowClass,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex size-5 flex-shrink-0 items-center justify-center", children: icon }),
+        /* @__PURE__ */ jsx("span", { className: "ml-3 min-w-0 truncate text-left", children: label }),
+        countNode,
+        trailing && /* @__PURE__ */ jsx(SidebarRowHoverContext.Provider, { value: isRowActive, children: /* @__PURE__ */ jsx("span", { className: "ml-2 flex flex-shrink-0 items-center", children: trailing }) })
+      ]
+    }
+  );
+}
+function SidebarPinToggle({
+  isPinned,
+  onToggle,
+  className,
+  "data-testid": testId
+}) {
+  const { expanded, labels } = useSidebarContext();
+  const label = isPinned ? labels.hideSidebar : labels.showSidebar;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: onToggle,
+      title: label,
+      "aria-label": label,
+      "aria-pressed": isPinned,
+      "data-testid": testIdOr(testId, { testId: "sidebar-pin-button" }),
+      className: cn(
+        "flex flex-shrink-0 items-center justify-center rounded-md text-muted-foreground transition-[opacity,colors] hover:bg-muted hover:text-foreground pointer-coarse:size-11",
+        "pointer-events-none opacity-0 group-hover/sidebar:pointer-events-auto group-hover/sidebar:opacity-100",
+        "group-focus-within/sidebar:pointer-events-auto group-focus-within/sidebar:opacity-100",
+        "pointer-coarse:pointer-events-auto pointer-coarse:opacity-100 focus-visible:pointer-events-auto focus-visible:opacity-100",
+        expanded ? "size-9" : "h-9 w-12",
+        className
+      ),
+      children: isPinned ? /* @__PURE__ */ jsx(PanelLeftClose, { className: "size-5" }) : /* @__PURE__ */ jsx(PanelLeftOpen, { className: "size-5" })
+    }
+  );
+}
+function SidebarDrawerHeader({
+  logo,
+  onClose,
+  closeLabel: closeLabelProp,
+  "data-testid": testId
+}) {
+  const { labels } = useSidebarContext();
+  const closeLabel = closeLabelProp ?? labels.closeNavigationMenu;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "sidebar-drawer-header",
+      className: "flex flex-shrink-0 items-center justify-between pb-2",
+      children: [
+        logo,
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            "aria-label": closeLabel,
+            "data-testid": testIdOr(testId, { testId: "mobile-nav-close" }),
+            className: "flex size-11 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+            children: /* @__PURE__ */ jsx(X, { className: "size-5" })
+          }
+        )
+      ]
+    }
+  );
+}
+var Sidebar = {
+  Root: SidebarRoot,
+  Header: SidebarHeader,
+  Nav: SidebarNav,
+  Group: SidebarGroup,
+  GroupLabel: SidebarGroupLabel,
+  NavItem: SidebarNavItem,
+  Footer: SidebarFooter,
+  PinToggle: SidebarPinToggle,
+  BadgeRow: SidebarBadgeRow,
+  DrawerHeader: SidebarDrawerHeader
+};
+var PULSE_STYLES = {
+  active: "animate-pulse-attention text-primary",
+  success: "animate-pulse-attention text-green-text",
+  // Steady (not animated) so a failure stays put and reads as a standing alert.
+  error: "text-red-text opacity-100"
+};
+function SidebarRowAction({
+  active = false,
+  onClick,
+  label,
+  pressed,
+  pulse = null,
+  "data-testid": testId,
+  children
+}) {
+  const rowHovered = useContext(SidebarRowHoverContext);
+  const tone = active ? "text-accent-foreground hover:bg-background/60" : pulse ? `${PULSE_STYLES[pulse]} hover:bg-muted` : cn(
+    "text-muted-foreground hover:bg-muted hover:text-foreground",
+    rowHovered ? "opacity-100" : "opacity-70"
+  );
+  return /* @__PURE__ */ jsx(BlocksTooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, onFocusCapture: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: (e) => {
+          e.stopPropagation();
+          onClick?.();
+        },
+        "aria-label": label,
+        "aria-pressed": pressed,
+        "data-slot": "sidebar-row-action",
+        "data-testid": testId,
+        className: cn("rounded-md p-1 transition-colors pointer-coarse:p-2.5", tone),
+        children
+      }
+    ) }),
+    /* @__PURE__ */ jsx(TooltipContent, { side: "right", children: label })
+  ] }) });
+}
+var DEFAULT_WORKSPACE_KIND_LABELS = {
+  common: "Common",
+  shared: "Shared",
+  private: "Private"
+};
+function workspaceKindMeta(kind, labels) {
+  const l = { ...DEFAULT_WORKSPACE_KIND_LABELS, ...labels };
+  if (kind === "common")
+    return { Icon: Globe, label: l.common, fill: "bg-muted text-muted-foreground" };
+  if (kind === "shared")
+    return { Icon: Users, label: l.shared, fill: "bg-accent text-accent-foreground" };
+  return { Icon: Lock, label: l.private, fill: "bg-primary text-primary-foreground" };
+}
+function workspaceKindColor(kind) {
+  if (kind === "common") return "var(--color-muted-foreground)";
+  if (kind === "shared") return "var(--color-secondary)";
+  return "var(--color-primary)";
+}
+function WorkspaceIdentity({
+  workspace,
+  expanded,
+  isActive = false,
+  labels,
+  testIds
+}) {
+  const kind = workspaceKindMeta(workspace.kind, labels);
+  const badge = /* @__PURE__ */ jsxs("span", { className: "relative flex flex-shrink-0", title: kind.label, children: [
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        "data-testid": testIdOr(testIds?.initial, { testId: "sidebar-workspace-card-initial" }),
+        className: cn(
+          "flex size-7 flex-shrink-0 items-center justify-center rounded-md text-sm font-semibold leading-none",
+          kind.fill
+        ),
+        children: workspace.name.charAt(0).toUpperCase()
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "absolute -bottom-1 -right-1 flex size-3.5 items-center justify-center rounded-full bg-background ring-1 ring-border", children: /* @__PURE__ */ jsx(
+      kind.Icon,
+      {
+        "aria-label": kind.label,
+        "data-testid": testIdOr(testIds?.type, { testId: "sidebar-workspace-card-type" }),
+        className: "size-2.5 text-muted-foreground"
+      }
+    ) })
+  ] });
+  if (!expanded)
+    return /* @__PURE__ */ jsx("div", { className: "flex flex-shrink-0 items-center justify-center", children: badge });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "flex flex-shrink-0 items-center justify-center", children: badge }),
+    /* @__PURE__ */ jsxs("div", { className: "ml-2.5 flex min-w-0 flex-1 flex-col text-left", children: [
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "min-w-0 truncate text-left text-sm font-semibold capitalize leading-tight transition-colors duration-100",
+            isActive ? "text-accent-foreground" : "text-foreground"
+          ),
+          children: workspace.name
+        }
+      ),
+      !workspace.projectName && /* @__PURE__ */ jsx("span", { className: "mt-0.5 truncate text-xs text-muted-foreground", children: kind.label }),
+      workspace.projectName && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "mt-0.5 flex min-w-0",
+          "data-testid": testIdOr(testIds?.projectName, {
+            testId: "sidebar-workspace-card-project-name"
+          }),
+          children: workspace.projectLine ?? /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: workspace.projectName })
+        }
+      )
+    ] })
+  ] });
+}
+var DEFAULT_WORKSPACE_SWITCHER_LABELS = {
+  ...DEFAULT_WORKSPACE_KIND_LABELS,
+  plural: "workspaces",
+  singular: "workspace",
+  switchWorkspace: (name, plural) => `${name} \u2014 switch ${plural}`,
+  allWorkspaces: (plural) => `All ${plural}`,
+  newWorkspace: (singular) => `New ${singular}`,
+  recentWorkspaces: (plural) => `Recent ${plural}`
+};
+function WorkspaceSwitcher({
+  workspace,
+  recent = [],
+  compact = false,
+  variant = "sidebar",
+  onSwitch,
+  onGoToList,
+  onNewWorkspace,
+  labels,
+  className,
+  testId,
+  testIds,
+  identityTestIds
+}) {
+  const l = { ...DEFAULT_WORKSPACE_SWITCHER_LABELS, ...labels };
+  const plural = l.plural.toLowerCase();
+  const singular = l.singular.charAt(0).toUpperCase() + l.singular.slice(1);
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        "data-slot": "workspace-switcher",
+        "data-testid": testIdOr(testId, { testId: "workspace-switcher-trigger" }),
+        "aria-label": l.switchWorkspace(workspace.name, plural),
+        className: cn(
+          "group flex min-w-0 items-center rounded-md transition-colors duration-100 hover:bg-muted focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+          variant === "appbar" ? "h-11 max-w-full gap-1 px-2" : compact ? "h-12 w-12 justify-center" : "h-12 w-full px-2",
+          className
+        ),
+        children: [
+          variant === "appbar" ? /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-base font-semibold text-foreground", children: workspace.name }) : /* @__PURE__ */ jsx(
+            WorkspaceIdentity,
+            {
+              workspace,
+              expanded: !compact,
+              labels: l,
+              testIds: identityTestIds
+            }
+          ),
+          !(compact && variant === "sidebar") && /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              "aria-hidden": "true",
+              className: "ml-auto size-4 flex-shrink-0 text-muted-foreground transition-transform duration-150 group-data-[state=open]:rotate-180"
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(
+      DropdownMenuContent,
+      {
+        align: "start",
+        className: "w-64 max-w-[calc(100vw-1.5rem)]",
+        "data-testid": testIdOr(testIds?.menu, { testId: "workspace-switcher-menu" }),
+        children: [
+          /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: onGoToList,
+              "data-testid": testIdOr(testIds?.all, { testId: "workspace-switcher-all" }),
+              className: "gap-2",
+              children: [
+                /* @__PURE__ */ jsx(LayoutGrid, { className: "size-4 flex-shrink-0 text-muted-foreground" }),
+                l.allWorkspaces(plural)
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: onNewWorkspace,
+              "data-testid": testIdOr(testIds?.new, { testId: "workspace-switcher-new" }),
+              className: "gap-2",
+              children: [
+                /* @__PURE__ */ jsx(Plus, { className: "size-4 flex-shrink-0 text-muted-foreground" }),
+                l.newWorkspace(singular)
+              ]
+            }
+          ),
+          recent.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ jsx(DropdownMenuLabel, { className: "text-xs font-normal text-muted-foreground", children: l.recentWorkspaces(plural) }),
+            recent.map((w) => {
+              const kind = workspaceKindMeta(w.kind, l);
+              return /* @__PURE__ */ jsxs(
+                DropdownMenuItem,
+                {
+                  onClick: () => onSwitch(w),
+                  "data-testid": prefixedTestId(testIds?.switchItem, w.id, {
+                    testId: `workspace-switch-${w.id}`
+                  }),
+                  className: "gap-2",
+                  children: [
+                    /* @__PURE__ */ jsxs("span", { className: "relative flex flex-shrink-0", title: kind.label, children: [
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          "aria-hidden": "true",
+                          className: cn(
+                            "flex size-6 flex-shrink-0 items-center justify-center rounded text-xs font-semibold leading-none",
+                            kind.fill
+                          ),
+                          children: w.name.charAt(0).toUpperCase()
+                        }
+                      ),
+                      /* @__PURE__ */ jsx("span", { className: "absolute -bottom-1 -right-1 flex size-3 items-center justify-center rounded-full bg-background ring-1 ring-border", children: /* @__PURE__ */ jsx(
+                        kind.Icon,
+                        {
+                          "aria-label": kind.label,
+                          "data-testid": prefixedTestId(testIds?.type, w.id, {
+                            testId: `workspace-type-${w.id}`
+                          }),
+                          className: "size-2 text-muted-foreground"
+                        }
+                      ) })
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate capitalize", children: w.name }),
+                    w.lastSeen && /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "ml-2 flex-shrink-0 text-xs tabular-nums text-muted-foreground",
+                        "data-testid": prefixedTestId(testIds?.lastSeen, w.id, {
+                          testId: `workspace-last-seen-${w.id}`
+                        }),
+                        children: w.lastSeen
+                      }
+                    )
+                  ]
+                },
+                w.id
+              );
+            })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+var DEFAULT_ASK_FIELD_LABELS = {
+  placeholder: "Ask or search\u2026",
+  inputLabel: "Ask AI or search your documents",
+  search: "Search",
+  askAi: "Ask AI",
+  askOrSearch: "Ask AI or search",
+  closeSearch: "Close search"
+};
+function AskField({
+  value,
+  onValueChange,
+  onAsk,
+  onSearch,
+  onInputKeyDown,
+  menu,
+  inputRef,
+  inputProps,
+  placeholder,
+  labels,
+  autoFocus = false,
+  className,
+  "data-testid": testIdProp
+}) {
+  const testId = testIdOr(testIdProp, { testId: "workspace-ask-bar" });
+  const l = { ...DEFAULT_ASK_FIELD_LABELS, ...labels };
+  const isEmpty = !value.trim();
+  const submit = (handler) => {
+    const text = value.trim();
+    if (text) handler(text);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), "data-slot": "ask-field", "data-testid": testId, children: [
+    menu && /* @__PURE__ */ jsx("div", { className: "absolute inset-x-0 top-9 z-30", children: menu }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "search",
+        className: "flex h-9 items-center gap-0.5 rounded-md border border-border bg-background pl-2.5 pr-0.5 transition-colors focus-within:ring-1 focus-within:ring-ring pointer-coarse:h-11",
+        children: [
+          /* @__PURE__ */ jsx(Sparkles, { "aria-hidden": "true", className: "size-4 shrink-0 text-ai-ink" }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ...inputProps,
+              ref: inputRef,
+              type: "text",
+              value,
+              onChange: (e) => onValueChange(e.target.value),
+              onKeyDown: (e) => {
+                onInputKeyDown?.(e);
+                if (e.defaultPrevented) return;
+                if (e.key === "Enter" && !e.nativeEvent.isComposing) {
+                  e.preventDefault();
+                  submit(onAsk);
+                }
+              },
+              placeholder: placeholder ?? l.placeholder,
+              "aria-label": l.inputLabel,
+              autoFocus,
+              className: "ml-1.5 h-8 min-w-0 flex-1 bg-transparent pointer-coarse:h-11 text-sm text-foreground outline-none placeholder:text-muted-foreground",
+              "data-testid": `${testId}-input`
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "icon",
+              disabled: isEmpty,
+              onClick: () => submit(onSearch),
+              title: l.search,
+              "aria-label": l.search,
+              className: "size-7 shrink-0 text-muted-foreground hover:text-foreground pointer-coarse:size-10",
+              "data-testid": `${testId}-search`,
+              children: /* @__PURE__ */ jsx(Search, { className: "size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "icon",
+              disabled: isEmpty,
+              onClick: () => submit(onAsk),
+              title: l.askAi,
+              "aria-label": l.askAi,
+              className: "!inline-flex size-7 shrink-0 text-ai-ink hover:bg-ai-soft hover:text-ai-ink pointer-coarse:size-10",
+              "data-testid": `${testId}-submit`,
+              children: /* @__PURE__ */ jsx(ArrowUp, { className: "size-4" })
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function AskTrigger({
+  onClick,
+  variant = "rail",
+  onSearch,
+  labels,
+  showLabels = false,
+  "data-testid": testId,
+  searchTestId,
+  askTestId
+}) {
+  const text = labels?.askOrSearch ?? DEFAULT_ASK_FIELD_LABELS.askOrSearch;
+  if (variant === "split") {
+    const searchText = labels?.search ?? DEFAULT_ASK_FIELD_LABELS.search;
+    const askText = labels?.askAi ?? DEFAULT_ASK_FIELD_LABELS.askAi;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "group",
+        "aria-label": text,
+        "data-slot": "ask-trigger",
+        "data-variant": "split",
+        "data-testid": testId,
+        className: "inline-flex items-center rounded-md border border-border bg-background",
+        children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: onSearch,
+              title: searchText,
+              "aria-label": searchText,
+              "data-testid": searchTestId ?? (testId ? `${testId}-search` : void 0),
+              className: cn(
+                "flex h-9 items-center justify-center gap-1.5 rounded-l-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground pointer-coarse:h-11",
+                showLabels ? "min-w-9 px-2.5 text-sm pointer-coarse:min-w-11" : "w-9 pointer-coarse:w-11"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(Search, { className: "size-4" }),
+                showLabels && /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: searchText })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick,
+              title: askText,
+              "aria-label": askText,
+              "data-testid": askTestId ?? (testId ? `${testId}-ask` : void 0),
+              className: cn(
+                "flex h-9 items-center justify-center gap-1.5 rounded-r-md border-l border-border text-ai-ink transition-colors hover:bg-ai-soft pointer-coarse:h-11",
+                showLabels ? "min-w-9 px-2.5 text-sm pointer-coarse:min-w-11" : "w-9 pointer-coarse:w-11"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(Sparkles, { className: "size-4" }),
+                showLabels && /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: askText })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick,
+      title: text,
+      "aria-label": text,
+      "data-slot": "ask-trigger",
+      "data-testid": testId,
+      className: cn(
+        "flex items-center justify-center rounded-md text-ai-ink transition-colors hover:bg-ai-soft",
+        variant === "rail" ? "h-9 w-12 border border-border bg-background pointer-coarse:h-11" : "size-11"
+      ),
+      children: /* @__PURE__ */ jsx(Sparkles, { className: variant === "rail" ? "size-4" : "size-5" })
+    }
+  );
+}
+function AskRow({
+  children,
+  onClose,
+  labels,
+  "data-testid": testId,
+  collapseTestId
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex h-14 flex-shrink-0 items-center gap-1 bg-background px-3 pt-safe",
+      "data-slot": "ask-row",
+      "data-testid": testIdOr(testId, { testId: "workspace-ask-bar-expanded" }),
+      onKeyDown: (e) => {
+        if (e.key === "Escape" && !e.defaultPrevented) onClose();
+      },
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            "aria-label": labels?.closeSearch ?? DEFAULT_ASK_FIELD_LABELS.closeSearch,
+            "data-testid": testIdOr(collapseTestId, { testId: "workspace-ask-bar-collapse" }),
+            className: "flex size-11 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+            children: /* @__PURE__ */ jsx(X, { className: "size-5" })
+          }
+        )
+      ]
+    }
+  );
+}
+var DEFAULT_MOBILE_BARS_LABELS = {
+  openNavigationMenu: "Open navigation menu",
+  workspaceSections: "Workspace sections"
+};
+function MobileAppBar({
+  showMenu = true,
+  onMenu,
+  title,
+  logo,
+  actions,
+  menuLabel,
+  labels,
+  className,
+  "data-testid": testId,
+  menuTestId
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "mobile-app-bar",
+      "data-testid": testId,
+      className: cn(
+        "sm:hidden flex h-14 flex-shrink-0 items-center gap-1 bg-background pl-1 pr-2 pt-safe",
+        className
+      ),
+      children: [
+        showMenu && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onMenu,
+            className: "flex size-11 shrink-0 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted",
+            "aria-label": menuLabel ?? labels?.openNavigationMenu ?? DEFAULT_MOBILE_BARS_LABELS.openNavigationMenu,
+            "data-testid": testIdOr(menuTestId, { testId: "mobile-nav-toggle" }),
+            children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: cn("flex min-w-0 flex-1 items-center", !showMenu && "pl-3"), children: title ?? logo }),
+        actions && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-0.5", children: actions })
+      ]
+    }
+  );
+}
+function MobileTabBar({
+  items,
+  label,
+  labels,
+  testIdPrefix,
+  className,
+  "data-testid": testId
+}) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      "aria-label": label ?? labels?.workspaceSections ?? DEFAULT_MOBILE_BARS_LABELS.workspaceSections,
+      "data-slot": "mobile-tab-bar",
+      "data-testid": testIdOr(testId, { testId: "mobile-tab-bar" }),
+      className: cn(
+        "flex h-16 flex-shrink-0 items-stretch bg-sidebar px-2 pb-safe sm:hidden",
+        className
+      ),
+      children: items.map((item) => /* @__PURE__ */ jsxs(
+        ActionLink,
+        {
+          href: item.href,
+          onSelect: item.onSelect,
+          disabled: item.disabled,
+          "aria-current": item.active ? "page" : void 0,
+          className: cn(
+            "flex min-h-12 min-w-0 flex-1 flex-col items-center justify-center gap-0.5 rounded-md text-xs transition-colors",
+            item.active ? "font-semibold text-primary" : "font-medium text-muted-foreground hover:text-foreground"
+          ),
+          "data-testid": prefixedTestId(testIdPrefix, item.id, { testId: `mobile-tab-${item.id}` }),
+          children: [
+            item.icon,
+            /* @__PURE__ */ jsx("span", { className: "max-w-full truncate px-1", children: item.label })
+          ]
+        },
+        item.id
+      ))
+    }
+  );
+}
+function ActionCluster({
+  layout = "bar",
+  status,
+  bell,
+  contacts,
+  account,
+  label,
+  "data-testid": testId = "sidebar-actions"
+}) {
+  const labelId = useId();
+  const stop = (e) => e.stopPropagation();
+  if (layout === "sidebar" || layout === "rail" || layout === "drawer") {
+    const rail = layout === "rail";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: rail ? "flex flex-col items-center gap-0.5" : "flex flex-col gap-0.5",
+        onClick: stop,
+        role: label ? "group" : void 0,
+        "aria-labelledby": label && layout === "drawer" ? labelId : void 0,
+        "aria-label": label && layout !== "drawer" ? label : void 0,
+        "data-slot": "action-cluster",
+        "data-layout": layout,
+        "data-testid": testId,
+        children: [
+          label && layout === "drawer" && /* @__PURE__ */ jsx(
+            "p",
+            {
+              id: labelId,
+              className: "px-3 pb-1 pt-2 text-xs font-semibold uppercase tracking-wider text-muted-foreground",
+              "data-slot": "action-cluster-label",
+              children: label
+            }
+          ),
+          bell,
+          contacts,
+          account && layout !== "drawer" && /* @__PURE__ */ jsx("div", { className: rail ? "mt-1" : "mt-1 min-w-0", children: account })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-1",
+      onClick: stop,
+      role: label ? "group" : void 0,
+      "aria-label": label,
+      "data-slot": "action-cluster",
+      children: [
+        status,
+        bell,
+        contacts,
+        account
+      ]
+    }
+  );
+}
+function ToolButton({
+  onClick,
+  label,
+  active = false,
+  "data-testid": testId,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick,
+      title: label,
+      "aria-label": label,
+      "data-slot": "tool-button",
+      "data-testid": testId,
+      className: cn(
+        "relative flex size-9 shrink-0 items-center justify-center rounded-md transition-colors hover:bg-accent hover:text-accent-foreground pointer-coarse:size-11",
+        active ? "bg-accent text-accent-foreground" : "text-muted-foreground"
+      ),
+      children
+    }
+  );
+}
+var TONES = {
+  progress: { className: "bg-muted text-foreground", Icon: Loader2, spin: true },
+  success: { className: "bg-green-bg text-green-text", Icon: CheckCircle2 },
+  error: { className: "bg-red-bg text-red-text", Icon: TriangleAlert }
+};
+function StatusRow({
+  tone,
+  label,
+  onClick,
+  compact = false,
+  icon,
+  "data-testid": testId
+}) {
+  const { className, Icon, spin } = TONES[tone];
+  return /* @__PURE__ */ jsx("div", { role: "status", "data-slot": "status-row", className: cn(compact && "flex justify-center"), children: /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-label": label,
+      title: label,
+      "data-testid": testId,
+      "data-tone": tone,
+      className: cn(
+        "flex items-center gap-2 rounded-md text-sm font-medium transition-colors hover:brightness-95 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:min-h-11",
+        compact ? "size-9 justify-center pointer-coarse:size-11" : "w-full px-2.5 py-1.5",
+        className
+      ),
+      children: [
+        icon ?? /* @__PURE__ */ jsx(
+          Icon,
+          {
+            className: cn("size-4 shrink-0", spin && "animate-spin motion-reduce:animate-none")
+          }
+        ),
+        !compact && /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-left", children: label })
+      ]
+    }
+  ) });
+}
+var DEFAULT_OFFLINE_PILL_LABELS = {
+  reconnect: "Reconnect"
+};
+var TONES2 = {
+  offline: { className: "bg-yellow-bg text-yellow-text", Icon: WifiOff },
+  failed: { className: "bg-red-bg text-red-text", Icon: TriangleAlert },
+  syncing: { className: "bg-blue-bg text-blue-text", Icon: RefreshCw }
+};
+function OfflinePill({
+  tone,
+  label,
+  compact = false,
+  onOpen,
+  onReconnect,
+  labels,
+  "data-testid": testId,
+  reconnectTestId
+}) {
+  const { className, Icon } = TONES2[tone];
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex items-center gap-1", compact && "justify-center"),
+      "data-slot": "offline-pill",
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            "data-testid": testIdOr(testId, { testId: "offline-sync-status" }),
+            "aria-label": label,
+            title: label,
+            onClick: onOpen,
+            className: cn(
+              "flex min-w-0 flex-1 items-center gap-2 rounded-md px-2.5 py-1.5 text-sm font-medium transition-colors hover:brightness-95 pointer-coarse:min-h-11",
+              compact && "flex-none justify-center",
+              className
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Icon, { className: cn("size-4 shrink-0", tone === "syncing" && "animate-spin") }),
+              !compact && /* @__PURE__ */ jsx("span", { className: "truncate", children: label })
+            ]
+          }
+        ),
+        !compact && onReconnect && // Forced visible (context true): there is no row to hover.
+        /* @__PURE__ */ jsx(SidebarRowHoverContext.Provider, { value: true, children: /* @__PURE__ */ jsx(
+          SidebarRowAction,
+          {
+            label: labels?.reconnect ?? DEFAULT_OFFLINE_PILL_LABELS.reconnect,
+            onClick: onReconnect,
+            "data-testid": testIdOr(reconnectTestId, { testId: "offline-reconnect-button" }),
+            children: /* @__PURE__ */ jsx(RefreshCw, { className: "size-5" })
+          }
+        ) })
+      ]
+    }
+  );
+}
+var DEFAULT_REMOTE_CONTROL_PILL_LABELS = {
+  turnOffRemoteControl: "Turn off remote control"
+};
+function RemoteControlPill({
+  isActive,
+  label,
+  onDisable,
+  disableLabel: disableLabelProp,
+  labels,
+  "data-testid": testId,
+  disableTestId
+}) {
+  const disableLabel = disableLabelProp ?? labels?.turnOffRemoteControl ?? DEFAULT_REMOTE_CONTROL_PILL_LABELS.turnOffRemoteControl;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "remote-control-pill",
+      "data-testid": testIdOr(testId, { testId: "remote-control-indicator" }),
+      className: cn(
+        "flex min-w-0 max-w-full items-center gap-1.5 rounded-full py-1 pl-2.5 pr-1 text-xs font-medium",
+        isActive ? "bg-accent text-accent-foreground" : "bg-muted text-muted-foreground"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(MousePointerClick, { className: cn("size-3.5 shrink-0", isActive && "animate-pulse") }),
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 max-w-[16rem] truncate", children: label }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onDisable,
+            title: disableLabel,
+            "aria-label": disableLabel,
+            "data-testid": testIdOr(disableTestId, { testId: "remote-control-indicator-disable" }),
+            className: "flex size-5 shrink-0 items-center justify-center rounded-full transition-colors hover:bg-foreground/10 hover:text-foreground pointer-coarse:size-8",
+            children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+          }
+        )
+      ]
+    }
+  );
+}
+var DEFAULT_TIP_CARD_LABELS = {
+  showMe: "Show me",
+  previousTip: "Previous tip",
+  nextTip: "Next tip",
+  editTip: "Edit tip",
+  tip: "Tip",
+  hideTips: "Hide tips",
+  position: (index, count) => `${index} of ${count}`
+};
+var ICON_BUTTON = "flex size-7 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:size-11";
+function TipCard({
+  message,
+  index = 0,
+  count = 1,
+  onPrev,
+  onNext,
+  ctaLabel,
+  onCta,
+  onDismiss,
+  onEdit,
+  onHoverChange,
+  labels,
+  className,
+  testId,
+  testIds
+}) {
+  const l = { ...DEFAULT_TIP_CARD_LABELS, ...labels };
+  const hasMany = count > 1;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "data-slot": "tip-card",
+      "aria-label": l.tip,
+      className: cn("min-w-0 rounded-lg bg-muted p-3 text-sm", className),
+      onMouseEnter: () => onHoverChange?.(true),
+      onMouseLeave: () => onHoverChange?.(false),
+      "data-testid": testIdOr(testId, { testId: "tip-row" }),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "-my-1 flex items-center gap-1.5 text-xs font-medium text-muted-foreground", children: [
+          /* @__PURE__ */ jsx(Lightbulb, { className: "size-4 shrink-0 text-primary", "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { children: l.tip }),
+          /* @__PURE__ */ jsxs("span", { className: "-mr-1.5 ml-auto flex items-center", children: [
+            onEdit && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onEdit,
+                "aria-label": l.editTip,
+                title: l.editTip,
+                className: cn(ICON_BUTTON, "text-red-text hover:bg-red-bg hover:text-red-text"),
+                "data-testid": testIdOr(testIds?.edit, { testId: "tip-edit" }),
+                children: /* @__PURE__ */ jsx(Pencil, { className: "size-3.5" })
+              }
+            ),
+            onDismiss && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onDismiss,
+                "aria-label": l.hideTips,
+                title: l.hideTips,
+                className: ICON_BUTTON,
+                "data-testid": testIdOr(testIds?.dismiss, { testId: "tip-dismiss" }),
+                children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "mt-2 text-foreground", children: message }),
+        (onCta || hasMany) && /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center justify-between gap-2", children: [
+          onCta ? /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              onClick: onCta,
+              className: "font-medium text-primary",
+              "data-testid": testIdOr(testIds?.cta, { testId: "page-header-info-cta" }),
+              children: ctaLabel ?? l.showMe
+            }
+          ) : /* @__PURE__ */ jsx("span", {}),
+          hasMany && /* @__PURE__ */ jsxs("span", { className: "-mr-1.5 flex items-center text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onPrev,
+                "aria-label": l.previousTip,
+                title: l.previousTip,
+                className: ICON_BUTTON,
+                "data-testid": testIdOr(testIds?.prev, { testId: "tip-prev" }),
+                children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "min-w-10 text-center tabular-nums", "aria-live": "polite", children: l.position(index + 1, count) }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onNext,
+                "aria-label": l.nextTip,
+                title: l.nextTip,
+                className: ICON_BUTTON,
+                "data-testid": testIdOr(testIds?.next, { testId: "tip-next" }),
+                children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4" })
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function resolveSidebarLayout(input) {
+  const { isSmallScreen, isDrawerRequested, isCollapsed, isPinned, isHovering } = input;
+  const isPeeking = input.isPeeking ?? false;
+  const canPin = isPinned && !isSmallScreen && !input.isNarrow;
+  const drawerOpen = isSmallScreen && isDrawerRequested;
+  const effectiveCollapsed = isCollapsed || isSmallScreen && !drawerOpen;
+  const hovering = isHovering && !isSmallScreen;
+  let mode;
+  if (drawerOpen) mode = "drawer";
+  else if (effectiveCollapsed) mode = "collapsed";
+  else if (canPin) mode = "pinned";
+  else mode = "rail";
+  const expanded = drawerOpen || canPin || !isCollapsed && isHovering || isCollapsed && isPeeking;
+  return { mode, expanded, hidden: isSmallScreen && !drawerOpen, hovering };
+}
+function useSidebarSettle(expanded, settleMs = 300) {
+  const [labelsExpanded, setLabelsExpanded] = useState(expanded);
+  const [tipsVisible, setTipsVisible] = useState(expanded);
+  const labelsTimer = useRef(null);
+  const tipsTimer = useRef(null);
+  useEffect(() => {
+    if (labelsTimer.current) clearTimeout(labelsTimer.current);
+    if (expanded) setLabelsExpanded(true);
+    else labelsTimer.current = setTimeout(() => setLabelsExpanded(false), settleMs);
+    return () => {
+      if (labelsTimer.current) clearTimeout(labelsTimer.current);
+    };
+  }, [expanded, settleMs]);
+  useEffect(() => {
+    if (tipsTimer.current) clearTimeout(tipsTimer.current);
+    if (expanded) tipsTimer.current = setTimeout(() => setTipsVisible(true), settleMs);
+    else setTipsVisible(false);
+    return () => {
+      if (tipsTimer.current) clearTimeout(tipsTimer.current);
+    };
+  }, [expanded, settleMs]);
+  return { labelsExpanded, tipsVisible };
+}
+var VARIANT_TONE = {
+  info: "bg-blue-bg text-primary border-blue-border",
+  warning: "bg-yellow-bg text-yellow-text border-yellow-border",
+  success: "bg-green-bg text-green-text border-green-border",
+  hint: "bg-blue-bg text-foreground border-blue-border"
+};
+function InfoBar({
+  message,
+  variant = "info",
+  hideIcon,
+  rightSlot,
+  cta,
+  onDismiss,
+  dismissLabel = "Dismiss",
+  className
+}) {
+  const VariantIcon = variant === "hint" ? Lightbulb : Info;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("relative z-10 flex w-full items-center pt-1", className),
+      "data-slot": "info-bar",
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex w-full flex-wrap items-center gap-3 rounded-md border px-3 py-[7px]",
+            VARIANT_TONE[variant]
+          ),
+          "data-testid": "page-header-info-box",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
+              !hideIcon && /* @__PURE__ */ jsx(VariantIcon, { className: "hidden size-4 shrink-0 sm:block" }),
+              /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 text-sm", children: message })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-2 sm:ml-auto sm:w-auto", children: [
+              rightSlot,
+              cta && /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "outline",
+                  size: "sm",
+                  onClick: cta.onClick,
+                  className: "h-8 flex-1 shrink-0 sm:flex-initial pointer-coarse:h-11",
+                  "data-testid": "page-header-info-cta",
+                  children: [
+                    cta.icon && /* @__PURE__ */ jsx("span", { className: "mr-1", children: cta.icon }),
+                    cta.label
+                  ]
+                }
+              ),
+              onDismiss && /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: onDismiss,
+                  "aria-label": dismissLabel,
+                  className: "size-8 shrink-0 p-0 hover:bg-foreground/5 pointer-coarse:size-11",
+                  "data-testid": "page-header-info-dismiss",
+                  children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+
+export { ActionCluster, AskField, AskRow, AskTrigger, DEFAULT_ASK_FIELD_LABELS, DEFAULT_MOBILE_BARS_LABELS, DEFAULT_OFFLINE_PILL_LABELS, DEFAULT_OVERLAY_ZONE_ID, DEFAULT_PAGE_CONTAINER_PADDING, DEFAULT_REMOTE_CONTROL_PILL_LABELS, DEFAULT_SIDEBAR_LABELS, DEFAULT_SIDEBAR_TOGGLE_BUTTON_LABELS, DEFAULT_TIP_CARD_LABELS, DEFAULT_WORKSPACE_KIND_LABELS, DEFAULT_WORKSPACE_SWITCHER_LABELS, InfoBar, MobileAppBar, MobileTabBar, OfflinePill, PageContainer, RemoteControlPill, Shell, Sidebar, SidebarBadgeRow, SidebarRowAction, SidebarRowHoverContext, SidebarToggleButton, StatusRow, TipCard, ToolButton, WorkspaceIdentity, WorkspaceSwitcher, resolveSidebarLayout, useDrawerBehavior, useOverlayZoneId, useSidebarContext, useSidebarSettle, workspaceKindColor, workspaceKindMeta };
+//# sourceMappingURL=chunk-7PEELPMA.js.map
+//# sourceMappingURL=chunk-7PEELPMA.js.map