@the-portland-company/shell 0.32.2 → 0.34.0

package/dist/index.js

@@ -1,12 +1,10 @@
-import { useTopBarIconSlotGlyph, resolveBrandGlyph } from './chunk-NV6WHTEZ.js';
-import { readThemeCookie, THEME_STORAGE_KEY, isThemePreference, writeThemeCookie, applyThemePreference } from './chunk-LL7RCJQN.js';
-import { extendTheme, IconButton, Box, Badge, Tooltip, ChakraProvider, useColorModeValue, Flex, Menu, MenuButton, HStack, Avatar, VStack, Text, Portal, MenuList, MenuItem, MenuDivider, Link as Link$1, Collapse, Skeleton, Button, useClipboard, Icon, Image, useDisclosure, useToast, Modal, ModalOverlay, ModalContent, ModalHeader, ModalCloseButton, ModalBody, Textarea, ModalFooter } from '@chakra-ui/react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { extendTheme, Tooltip, ChakraProvider } from '@chakra-ui/react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx2 from 'clsx';
-import { Link, useLocation, useNavigate, NavLink } from 'react-router-dom';
-import { createContext, forwardRef, useEffect, useState, useMemo, useContext, useCallback } from 'react';
-import { FiChevronDown, FiUser, FiRotateCcw, FiBriefcase, FiTrash2, FiUserPlus, FiLogOut, FiMenu, FiX } from 'react-icons/fi';
-import { keyframes } from '@emotion/react';
+import { Link, useLocation } from 'react-router-dom';
+import { createContext, useEffect, useState, useMemo, useContext } from 'react';
+
+// src/theme/index.ts
 
 // src/theme/tokens.generated.ts
 var brandRamp = { 50: "#FDECEE", 100: "#FCE0E3", 200: "#F8B6BD", 300: "#EF6671", 400: "#EA4751", 500: "#E63946", 600: "#C42E3A", 700: "#9F252E", 800: "#660F17", 900: "#39080D" };
@@ -1259,367 +1257,6 @@ function BrandLogo({ src, alt = "Brand", className, style }) {
     }
   );
 }
-var BrandLogo_default = BrandLogo;
-
-// src/lib/userDisplay.ts
-function getUserDisplayName(user) {
-  if (!user) return "User";
-  return user.profile?.full_name || user.profile?.name || user.user_metadata?.full_name || user.user_metadata?.name || (typeof user.email === "string" ? user.email.split("@")[0] : "") || user.email || "User";
-}
-
-// src/lib/resolveModeConfig.ts
-function resolveModeConfig(mode) {
-  if (!mode) return null;
-  const modes = mode.modes ?? [];
-  if (typeof mode.getModeConfig === "function") {
-    try {
-      const result = mode.getModeConfig();
-      if (result) return result;
-    } catch {
-    }
-  }
-  return modes.find((m) => m.id === mode.currentMode) ?? modes[0] ?? null;
-}
-function formatFirstLast(name) {
-  const parts = name.split(/\s+/).filter(Boolean);
-  if (parts.length <= 1) return name;
-  return `${parts[0]} ${parts[parts.length - 1][0].toUpperCase()}.`;
-}
-var THEME_OPTIONS = [
-  { value: "light", label: "Light" },
-  { value: "system", label: "System" },
-  { value: "dark", label: "Dark" }
-];
-function AppearanceControl() {
-  const [value, setValue] = useState("system");
-  useEffect(() => {
-    const cookie = readThemeCookie();
-    let ls = null;
-    try {
-      ls = localStorage.getItem(THEME_STORAGE_KEY);
-    } catch {
-    }
-    setValue(cookie ?? (isThemePreference(ls) ? ls : null) ?? "system");
-  }, []);
-  const pick = (next) => {
-    setValue(next);
-    writeThemeCookie(next);
-    try {
-      localStorage.setItem(THEME_STORAGE_KEY, next);
-    } catch {
-    }
-    applyThemePreference(next);
-    try {
-      window.dispatchEvent(
-        new CustomEvent("politogy:theme-preference", { detail: next })
-      );
-    } catch {
-    }
-  };
-  return /* @__PURE__ */ jsxs(Box, { px: 3, py: 2, children: [
-    /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.500", fontWeight: "semibold", mb: 2, children: "APPEARANCE" }),
-    /* @__PURE__ */ jsx(
-      HStack,
-      {
-        spacing: 0,
-        borderWidth: "1px",
-        borderColor: "var(--line, #E2E8F0)",
-        borderRadius: "full",
-        overflow: "hidden",
-        children: THEME_OPTIONS.map((opt) => /* @__PURE__ */ jsx(
-          Box,
-          {
-            as: "button",
-            type: "button",
-            role: "radio",
-            "aria-checked": value === opt.value,
-            onClick: () => pick(opt.value),
-            flex: 1,
-            px: 3,
-            py: 1.5,
-            fontSize: "xs",
-            fontWeight: "semibold",
-            bg: value === opt.value ? "var(--color-race-red, #E63946)" : "transparent",
-            color: value === opt.value ? "white" : "gray.500",
-            _hover: value === opt.value ? {} : { bg: "var(--panel, #F7FAFC)" },
-            transition: "background 0.15s",
-            children: opt.label
-          },
-          opt.value
-        ))
-      }
-    )
-  ] });
-}
-function avatarUrlFromUser(user) {
-  if (!user) return void 0;
-  const meta = user.raw.user_metadata;
-  return meta?.avatar_url ?? void 0;
-}
-function UserMenu() {
-  const { user, status, signOut } = useShellAuth();
-  const {
-    myProfileHref,
-    organizationSettingsHref,
-    showContinueOnboarding,
-    onContinueOnboarding,
-    userAvatarUrl
-  } = useShellChrome();
-  const linked = useShellLinkedAccounts();
-  const mode = useShellMode();
-  const org = useShellOrganization();
-  const role = useShellRole();
-  const navigate = useNavigate();
-  const menuListBg = "var(--topbar-bg, #FFFFFF)";
-  const menuListBorderColor = useColorModeValue("gray.200", "gray.700");
-  if (status !== "authenticated" || !user) return null;
-  const rawDisplayName = getUserDisplayName(user.raw);
-  const hasRealName = !!rawDisplayName && !rawDisplayName.includes("@");
-  const displayName = hasRealName ? formatFirstLast(rawDisplayName) : user.email ?? rawDisplayName;
-  const avatarUrl = userAvatarUrl ?? avatarUrlFromUser(user);
-  const modeConfig = resolveModeConfig(mode);
-  const currentOrg = org?.currentOrg ?? null;
-  const linkedAccounts = linked?.linkedAccounts ?? [];
-  const activeRoleConfig = role?.activeRoleConfig ?? null;
-  return /* @__PURE__ */ jsx(Flex, { alignItems: "center", children: /* @__PURE__ */ jsxs(Menu, { children: [
-    /* @__PURE__ */ jsx(MenuButton, { py: 2, transition: "all 0.3s", _focus: { boxShadow: "none" }, children: /* @__PURE__ */ jsxs(HStack, { children: [
-      /* @__PURE__ */ jsx(
-        Avatar,
-        {
-          size: "sm",
-          src: avatarUrl,
-          name: displayName,
-          bg: modeConfig?.primaryColor || "brand.500"
-        }
-      ),
-      /* @__PURE__ */ jsxs(
-        VStack,
-        {
-          display: { base: "none", md: "flex" },
-          alignItems: "flex-start",
-          spacing: "1px",
-          ml: "2",
-          children: [
-            /* @__PURE__ */ jsx(HStack, { spacing: 2, children: /* @__PURE__ */ jsx(Text, { fontSize: "sm", children: displayName }) }),
-            hasRealName ? /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.500", children: user.email }) : null
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx(Box, { display: { base: "none", md: "flex" }, children: /* @__PURE__ */ jsx(FiChevronDown, {}) })
-    ] }) }),
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(MenuList, { bg: menuListBg, borderColor: menuListBorderColor, zIndex: 1500, children: [
-      /* @__PURE__ */ jsx(MenuItem, { icon: /* @__PURE__ */ jsx(FiUser, {}), onClick: () => navigate(myProfileHref), children: "My Profile" }),
-      showContinueOnboarding && /* @__PURE__ */ jsx(
-        MenuItem,
-        {
-          icon: /* @__PURE__ */ jsx(FiRotateCcw, {}),
-          onClick: () => {
-            if (onContinueOnboarding) onContinueOnboarding();
-            else window.dispatchEvent(new CustomEvent("app:continue-onboarding"));
-          },
-          children: "Continue Onboarding"
-        }
-      ),
-      organizationSettingsHref && /* @__PURE__ */ jsx(
-        MenuItem,
-        {
-          icon: /* @__PURE__ */ jsx(FiBriefcase, {}),
-          onClick: () => navigate(organizationSettingsHref),
-          children: "Organization Settings"
-        }
-      ),
-      /* @__PURE__ */ jsx(MenuDivider, {}),
-      /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.500", px: 3, py: 1, fontWeight: "semibold", children: "ROLES & ORGANIZATIONS" }),
-      /* @__PURE__ */ jsx(Box, { px: 3, py: 2, children: /* @__PURE__ */ jsxs(VStack, { align: "stretch", spacing: 1, children: [
-        currentOrg && currentOrg.role && /* @__PURE__ */ jsxs(HStack, { children: [
-          /* @__PURE__ */ jsx(
-            Badge,
-            {
-              size: "sm",
-              colorScheme: currentOrg.role === "owner" ? "purple" : currentOrg.role === "admin" ? "blue" : "gray",
-              children: currentOrg.role.charAt(0).toUpperCase() + currentOrg.role.slice(1)
-            }
-          ),
-          /* @__PURE__ */ jsxs(Text, { fontSize: "xs", color: "gray.500", children: [
-            "in ",
-            currentOrg.name
-          ] })
-        ] }),
-        activeRoleConfig && !currentOrg?.role && /* @__PURE__ */ jsx(Badge, { colorScheme: activeRoleConfig.color, size: "sm", children: activeRoleConfig.name })
-      ] }) }),
-      linked && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(MenuDivider, {}),
-        /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.500", px: 3, py: 1, fontWeight: "semibold", children: "ACCOUNTS" }),
-        /* @__PURE__ */ jsx(Box, { px: 3, py: 2, children: /* @__PURE__ */ jsxs(HStack, { spacing: 2, children: [
-          /* @__PURE__ */ jsx(Avatar, { size: "xs", src: avatarUrl, name: displayName }),
-          /* @__PURE__ */ jsxs(VStack, { align: "start", spacing: 0, flex: 1, children: [
-            /* @__PURE__ */ jsx(Text, { fontSize: "xs", fontWeight: "medium", color: "brand.600", children: displayName }),
-            /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.400", children: "Active" })
-          ] })
-        ] }) }),
-        linkedAccounts.map((account) => /* @__PURE__ */ jsx(
-          MenuItem,
-          {
-            onClick: () => {
-              void linked.switchToAccount(account.id);
-            },
-            _hover: { bg: "gray.50" },
-            children: /* @__PURE__ */ jsxs(HStack, { spacing: 2, flex: 1, justify: "space-between", children: [
-              /* @__PURE__ */ jsxs(HStack, { spacing: 2, children: [
-                /* @__PURE__ */ jsx(
-                  Avatar,
-                  {
-                    size: "xs",
-                    src: account.avatarUrl ?? void 0,
-                    name: account.displayName ?? account.email
-                  }
-                ),
-                /* @__PURE__ */ jsxs(VStack, { align: "start", spacing: 0, children: [
-                  /* @__PURE__ */ jsx(Text, { fontSize: "xs", fontWeight: "medium", noOfLines: 1, children: account.displayName ?? account.email.split("@")[0] }),
-                  /* @__PURE__ */ jsx(Tooltip, { label: account.email, placement: "top", hasArrow: true, children: /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      fontSize: "xs",
-                      color: "gray.500",
-                      maxW: "120px",
-                      noOfLines: 1,
-                      textOverflow: "ellipsis",
-                      children: account.email
-                    }
-                  ) })
-                ] })
-              ] }),
-              /* @__PURE__ */ jsx(
-                IconButton,
-                {
-                  as: "span",
-                  role: "button",
-                  tabIndex: 0,
-                  "aria-label": "Remove account",
-                  icon: /* @__PURE__ */ jsx(FiTrash2, {}),
-                  size: "xs",
-                  variant: "ghost",
-                  colorScheme: "red",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    linked.onRemoveAccount(account.id);
-                  }
-                }
-              )
-            ] })
-          },
-          account.id
-        )),
-        /* @__PURE__ */ jsx(
-          MenuItem,
-          {
-            icon: /* @__PURE__ */ jsx(FiUserPlus, {}),
-            onClick: linked.onAddAccount,
-            color: "brand.500",
-            children: "Add Account"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(MenuDivider, {}),
-      /* @__PURE__ */ jsx(AppearanceControl, {}),
-      /* @__PURE__ */ jsx(MenuDivider, {}),
-      /* @__PURE__ */ jsx(MenuItem, { icon: /* @__PURE__ */ jsx(FiLogOut, {}), onClick: () => void signOut(), children: "Sign out" })
-    ] }) })
-  ] }) });
-}
-function Header({ onOpen, id }) {
-  const {
-    pageTitle,
-    breadcrumbs,
-    headerActions,
-    headerIconsSlot,
-    brandLogoSrc
-  } = useShellChrome();
-  const mobileNavBg = "var(--sidebar-bg, #FFFFFF)";
-  const mobileNavBorderColor = "var(--sidebar-border, #E2E8F0)";
-  return /* @__PURE__ */ jsx(
-    Flex,
-    {
-      id: id || "mobile-nav-container",
-      ml: { base: 0, md: 60 },
-      px: { base: 4, md: 4 },
-      height: "20",
-      alignItems: "center",
-      bg: mobileNavBg,
-      borderBottomWidth: "1px",
-      borderBottomColor: mobileNavBorderColor,
-      justifyContent: { base: "space-between", md: "space-between" },
-      children: /* @__PURE__ */ jsxs(Flex, { w: "full", mx: "auto", align: "center", justify: "space-between", children: [
-        /* @__PURE__ */ jsxs(HStack, { spacing: 4, minW: "0", children: [
-          onOpen ? /* @__PURE__ */ jsx(
-            IconButton,
-            {
-              display: { base: "flex", md: "none" },
-              onClick: onOpen,
-              variant: "outline",
-              "aria-label": "open menu",
-              icon: /* @__PURE__ */ jsx(FiMenu, {})
-            }
-          ) : null,
-          brandLogoSrc ? /* @__PURE__ */ jsx(Box, { display: { base: "flex", md: "none" }, h: "32px", children: /* @__PURE__ */ jsx(BrandLogo_default, { src: brandLogoSrc, className: "h-full w-auto object-contain" }) }) : null,
-          /* @__PURE__ */ jsxs(
-            VStack,
-            {
-              align: "flex-start",
-              spacing: 0,
-              minW: "0",
-              display: { base: "none", md: "flex" },
-              children: [
-                pageTitle ? /* @__PURE__ */ jsx(Text, { fontSize: "lg", fontWeight: "bold", noOfLines: 1, children: pageTitle }) : null,
-                breadcrumbs && breadcrumbs.length > 0 ? /* @__PURE__ */ jsx(HStack, { spacing: 2, color: "gray.500", fontSize: "sm", mt: "1px", minW: "0", children: breadcrumbs.map((b, idx) => /* @__PURE__ */ jsxs(Box, { display: "inline-flex", alignItems: "center", minW: "0", children: [
-                  idx > 0 ? /* @__PURE__ */ jsx(Text, { color: "gray.400", mr: 2, children: " > " }) : null,
-                  b.href ? /* @__PURE__ */ jsx(
-                    Link$1,
-                    {
-                      as: NavLink,
-                      to: b.href,
-                      _hover: { textDecoration: "underline" },
-                      noOfLines: 1,
-                      children: b.label
-                    }
-                  ) : /* @__PURE__ */ jsx(Text, { noOfLines: 1, children: b.label })
-                ] }, `${b.label}-${idx}`)) }) : null
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs(HStack, { spacing: 0, align: "center", children: [
-          /* @__PURE__ */ jsxs(
-            HStack,
-            {
-              spacing: "var(--topbar-icon-gap, 8px)",
-              mr: "15px",
-              color: "var(--topbar-icon-color, #4A5568)",
-              sx: {
-                '& button:not([role="menuitem"]):not([data-menu-item])': {
-                  width: "var(--topbar-icon-button-size, 32px)",
-                  height: "var(--topbar-icon-button-size, 32px)",
-                  minWidth: "var(--topbar-icon-button-size, 32px)",
-                  padding: 0
-                },
-                '& button:not([role="menuitem"]):not([data-menu-item]) svg, & button:not([role="menuitem"]):not([data-menu-item]) img': {
-                  width: "var(--topbar-icon-size, 20px)",
-                  height: "var(--topbar-icon-size, 20px)",
-                  strokeWidth: "var(--topbar-icon-stroke-width, 2)"
-                }
-              },
-              children: [
-                headerActions,
-                headerIconsSlot
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx(UserMenu, {})
-        ] })
-      ] })
-    }
-  );
-}
 function BrandIcon({
   name,
   size,
@@ -1644,317 +1281,6 @@ function BrandIcon({
     }
   );
 }
-var BrandIcon_default = BrandIcon;
-var safeHref = (h) => h && /^(https?:|mailto:|tel:|\/|#|\.)/i.test(h.trim()) ? h : "#";
-function NavItem({
-  icon,
-  brandIcon,
-  children,
-  href,
-  action,
-  subItems,
-  badge,
-  subLabel,
-  isSubItem = false,
-  isExpanded,
-  onToggle,
-  menuKey,
-  isDisabled: navIsDisabled,
-  disabled,
-  ...rest
-}) {
-  const location = useLocation();
-  const navigate = useNavigate();
-  const mode = useShellMode();
-  const modeConfig = resolveModeConfig(mode);
-  const navPref = useShellNavigationPreference();
-  const showSubMenu = navPref?.showSubMenu ?? true;
-  const isDisabled = Boolean(navIsDisabled || disabled);
-  const effectiveHref = href || (Array.isArray(subItems) && subItems.length > 0 ? subItems[0].href : void 0);
-  const effectivePathname = effectiveHref?.split("?")[0];
-  const currentFullPath = location.pathname + location.search;
-  const currentSearchParams = useMemo(
-    () => new URLSearchParams(location.search),
-    [location.search]
-  );
-  const matchesSubItem = (itemHref) => {
-    if (!itemHref) return false;
-    if (itemHref === currentFullPath) return true;
-    const itemPath = itemHref.split("?")[0];
-    const itemSearch = itemHref.includes("?") ? itemHref.split("?")[1] : "";
-    if (itemPath === location.pathname && !itemSearch) {
-      return true;
-    }
-    if (location.pathname.startsWith(`${itemPath}/`)) {
-      const itemSegments = itemPath.split("/").filter(Boolean);
-      const locationSegments = location.pathname.split("/").filter(Boolean);
-      const itemLastSegment = itemSegments[itemSegments.length - 1];
-      const locationLastSegment = locationSegments[locationSegments.length - 1];
-      if (itemLastSegment && itemLastSegment === locationLastSegment) {
-        return true;
-      }
-    }
-    if (itemPath === location.pathname && itemSearch) {
-      const itemSearchParams = new URLSearchParams(itemSearch);
-      const itemTab = itemSearchParams.get("tab") || itemSearchParams.get("view");
-      if (!itemTab) return true;
-      return itemTab === currentSearchParams.get("tab");
-    }
-    if (itemPath && !itemHref.includes("?") && itemPath !== effectivePathname) {
-      const segment = itemPath.split("/").pop();
-      if (segment && location.pathname.endsWith("/" + segment) && location.pathname.startsWith(itemPath.split("/").slice(0, -1).join("/"))) {
-        return true;
-      }
-    }
-    return false;
-  };
-  const isActive = isSubItem ? matchesSubItem(effectiveHref || "") : (() => {
-    if (!effectivePathname) return false;
-    if (location.pathname === effectivePathname) return true;
-    if (location.pathname.startsWith(`${effectivePathname}/`)) return true;
-    const dashboardOverviewMatch = effectivePathname.match(
-      /^\/[^/]+\/[^/]*\/dashboard\/overview$/
-    );
-    if (dashboardOverviewMatch) {
-      const dashboardRoot = effectivePathname.replace(/\/overview$/, "");
-      return location.pathname === dashboardRoot || location.pathname.startsWith(`${dashboardRoot}/`) || location.pathname.startsWith(`${dashboardRoot}&`);
-    }
-    return effectivePathname !== `/${location.pathname.split("/")[1]}/dashboard` && location.pathname.startsWith(effectivePathname + "/");
-  })();
-  const hasSubItems = showSubMenu && Array.isArray(subItems) && subItems.length > 0;
-  const hasActiveChild = Array.isArray(subItems) && subItems.some((item) => matchesSubItem(item.href || ""));
-  const isParentActive = isActive || hasActiveChild;
-  const isSubMenuOpen = isExpanded !== void 0 ? isExpanded : hasSubItems && subItems.some((item) => matchesSubItem(item.href || ""));
-  const submenuBg = "var(--sidebar-submenu-bg, #F1F5F9)";
-  const expandedRowBg = isParentActive ? modeConfig?.primaryColor || "brand.500" : isSubMenuOpen ? submenuBg : "transparent";
-  const expandedRowTextColor = isParentActive ? "white" : isSubMenuOpen ? "var(--sidebar-text, #1A202C)" : "var(--sidebar-text-muted, #4A5568)";
-  const disabledRowBg = isSubItem ? submenuBg : "transparent";
-  const disabledRowTextColor = "gray.400";
-  const renderIcon = (activeForHover) => {
-    if (brandIcon) {
-      return /* @__PURE__ */ jsx(
-        Box,
-        {
-          mr: "4",
-          display: "inline-flex",
-          alignItems: "center",
-          filter: isParentActive || isActive ? "brightness(0) invert(1)" : void 0,
-          _groupHover: isDisabled ? void 0 : {
-            filter: activeForHover ? "brightness(0) invert(1)" : void 0
-          },
-          children: /* @__PURE__ */ jsx(BrandIcon_default, { name: brandIcon, size: 18 })
-        }
-      );
-    }
-    if (icon) {
-      return /* @__PURE__ */ jsx(
-        Box,
-        {
-          mr: "4",
-          fontSize: "16",
-          _groupHover: {
-            color: isDisabled ? disabledRowTextColor : activeForHover ? "white" : "var(--sidebar-hover-text, #FFFFFF)"
-          },
-          as: icon
-        }
-      );
-    }
-    return null;
-  };
-  if (hasSubItems) {
-    return /* @__PURE__ */ jsxs(Box, { children: [
-      effectiveHref ? /* @__PURE__ */ jsxs(
-        Flex,
-        {
-          align: "center",
-          px: "4",
-          py: "2.5",
-          mx: "4",
-          w: "auto",
-          borderTopRadius: "lg",
-          borderBottomRadius: isSubMenuOpen ? 0 : "lg",
-          role: "group",
-          cursor: isDisabled ? "not-allowed" : "pointer",
-          opacity: 1,
-          pointerEvents: isDisabled ? "none" : "auto",
-          "data-nav-item-active": String(isParentActive),
-          bg: isDisabled ? disabledRowBg : expandedRowBg,
-          color: isDisabled ? disabledRowTextColor : expandedRowTextColor,
-          _hover: {
-            bg: isDisabled ? disabledRowBg : isParentActive ? modeConfig?.accentColor || "brand.600" : "var(--sidebar-hover-bg, #E2E8F0)",
-            color: isDisabled ? disabledRowTextColor : isParentActive ? "white" : "var(--sidebar-hover-text, #FFFFFF)"
-          },
-          "aria-disabled": isDisabled ? "true" : "false",
-          onClick: (e) => {
-            if (isDisabled) return;
-            e.preventDefault();
-            e.stopPropagation();
-            onToggle?.(menuKey || null);
-          },
-          ...rest,
-          children: [
-            renderIcon(isParentActive),
-            /* @__PURE__ */ jsx(Box, { flex: "1", children }),
-            /* @__PURE__ */ jsx(
-              Box,
-              {
-                as: FiChevronDown,
-                transform: isSubMenuOpen ? "rotate(180deg)" : void 0,
-                transition: "transform 0.2s"
-              }
-            )
-          ]
-        }
-      ) : /* @__PURE__ */ jsxs(
-        Flex,
-        {
-          align: "center",
-          px: "4",
-          py: "2.5",
-          mx: "4",
-          w: "auto",
-          borderTopRadius: "lg",
-          borderBottomRadius: isSubMenuOpen ? 0 : "lg",
-          role: "group",
-          cursor: isDisabled ? "not-allowed" : "pointer",
-          opacity: 1,
-          pointerEvents: isDisabled ? "none" : "auto",
-          "data-nav-item-active": String(isParentActive),
-          bg: isDisabled ? disabledRowBg : expandedRowBg,
-          color: isDisabled ? disabledRowTextColor : expandedRowTextColor,
-          _hover: {
-            bg: isDisabled ? disabledRowBg : hasActiveChild ? modeConfig?.accentColor || "brand.600" : "var(--sidebar-hover-bg, #E2E8F0)",
-            color: isDisabled ? disabledRowTextColor : hasActiveChild ? "white" : "var(--sidebar-hover-text, #FFFFFF)"
-          },
-          "aria-disabled": isDisabled ? "true" : "false",
-          onClick: (e) => {
-            if (isDisabled) return;
-            e.stopPropagation();
-            onToggle?.(menuKey || null);
-          },
-          ...rest,
-          children: [
-            renderIcon(hasActiveChild),
-            /* @__PURE__ */ jsx(Box, { flex: "1", children }),
-            /* @__PURE__ */ jsx(
-              Box,
-              {
-                as: FiChevronDown,
-                transform: isSubMenuOpen ? "rotate(180deg)" : void 0,
-                transition: "transform 0.2s"
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx(Collapse, { in: isSubMenuOpen, animateOpacity: true, children: /* @__PURE__ */ jsx(
-        Box,
-        {
-          px: "0",
-          mx: "4",
-          w: "auto",
-          mb: "2",
-          py: "1",
-          borderTopRadius: 0,
-          borderBottomRadius: "md",
-          bg: submenuBg,
-          children: subItems.map((item) => /* @__PURE__ */ jsx(
-            NavItem,
-            {
-              icon: item.icon,
-              brandIcon: item.brandIcon,
-              href: item.href,
-              isSubItem: true,
-              isDisabled: item.disabled,
-              subLabel: item.subLabel,
-              subItems: item.subItems,
-              children: item.name
-            },
-            item.name
-          ))
-        }
-      ) })
-    ] });
-  }
-  const handleClick = (e) => {
-    if (isDisabled) {
-      e.preventDefault();
-      return;
-    }
-    if (action) {
-      e.preventDefault();
-      action();
-      return;
-    }
-    if (effectiveHref) {
-      e.preventDefault();
-      navigate(effectiveHref);
-    }
-  };
-  const rowActive = isSubItem ? isActive : isParentActive;
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      as: "a",
-      href: safeHref(effectiveHref),
-      onClick: handleClick,
-      style: { textDecoration: "none" },
-      children: /* @__PURE__ */ jsxs(
-        Flex,
-        {
-          align: "center",
-          px: "4",
-          py: "2.5",
-          mx: isSubItem ? "0" : "4",
-          w: isSubItem ? "full" : "auto",
-          borderRadius: isSubItem ? "0" : "lg",
-          role: "group",
-          cursor: isDisabled ? "not-allowed" : "pointer",
-          opacity: 1,
-          pointerEvents: isDisabled ? "none" : "auto",
-          "data-nav-item-active": String(rowActive),
-          bg: isDisabled ? disabledRowBg : rowActive ? isSubItem ? "var(--sidebar-hover-bg, #EDF2F7)" : modeConfig?.primaryColor || "brand.500" : "transparent",
-          color: isDisabled ? disabledRowTextColor : rowActive ? isSubItem ? modeConfig?.primaryColor || "brand.500" : "white" : "gray.600",
-          _hover: {
-            bg: isDisabled ? disabledRowBg : rowActive ? isSubItem ? "var(--sidebar-hover-bg, #E2E8F0)" : modeConfig?.accentColor || "brand.600" : "var(--sidebar-hover-bg, #EDF2F7)",
-            color: isDisabled ? disabledRowTextColor : rowActive ? isSubItem ? modeConfig?.primaryColor || "brand.500" : "white" : "var(--sidebar-hover-text, #FFFFFF)"
-          },
-          "aria-disabled": isDisabled ? "true" : "false",
-          onClick: handleClick,
-          ...rest,
-          children: [
-            brandIcon ? /* @__PURE__ */ jsx(
-              Box,
-              {
-                mr: "4",
-                display: "inline-flex",
-                alignItems: "center",
-                filter: rowActive && !isSubItem ? "brightness(0) invert(1)" : void 0,
-                children: /* @__PURE__ */ jsx(BrandIcon_default, { name: brandIcon, size: 18 })
-              }
-            ) : icon ? /* @__PURE__ */ jsx(
-              Box,
-              {
-                mr: "4",
-                fontSize: "16",
-                _groupHover: {
-                  color: isDisabled ? disabledRowTextColor : rowActive ? isSubItem ? modeConfig?.primaryColor || "brand.500" : "white" : "var(--sidebar-hover-text, #FFFFFF)"
-                },
-                as: icon
-              }
-            ) : null,
-            /* @__PURE__ */ jsxs(Box, { flex: "1", children: [
-              /* @__PURE__ */ jsx(Box, { children }),
-              subLabel ? /* @__PURE__ */ jsx(Text, { mt: 0.5, fontSize: "10px", lineHeight: "1.3", color: "gray.400", children: subLabel }) : null,
-              badge && /* @__PURE__ */ jsx(Badge, { colorScheme: "red", size: "xs", mt: 1, fontSize: "xs", display: "block", children: badge })
-            ] })
-          ]
-        }
-      )
-    }
-  );
-}
-var NavItem_default = NavItem;
 
 // src/lib/orgColors.ts
 var HEX_COLOR_PATTERN = /^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;
@@ -2002,1135 +1328,11 @@ function getOrganizationBadgeLetters(name) {
   const compact = parts[0] || normalizedName.replace(/\s+/g, "");
   return compact.slice(0, 2).toUpperCase() || "OR";
 }
-function OrgBadge({ name, logoUrl, brandColor, size }) {
-  const normalizedColor = normalizeHexColor(brandColor);
-  const badgeColor = normalizedColor || "#5a5a5a";
-  const badgeLetters = getOrganizationBadgeLetters(name);
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      boxSize: size,
-      borderRadius: "full",
-      overflow: "hidden",
-      border: "1px solid white",
-      flexShrink: 0,
-      bg: logoUrl ? "whiteAlpha.300" : badgeColor,
-      color: "white",
-      display: "inline-flex",
-      alignItems: "center",
-      justifyContent: "center",
-      fontSize: "xs",
-      fontWeight: "bold",
-      letterSpacing: "0.08em",
-      textTransform: "uppercase",
-      children: logoUrl ? /* @__PURE__ */ jsx(Image, { src: logoUrl, alt: `${name ?? "Organization"} logo`, boxSize: "full", objectFit: "cover" }) : badgeLetters
-    }
-  );
-}
-function OrganizationIdCopy({ orgId }) {
-  const { hasCopied, onCopy } = useClipboard(orgId);
-  const copiedAnimation = keyframes`
-    0% { opacity: 0; transform: translateY(6px); }
-    20% { opacity: 1; transform: translateY(0); }
-    100% { opacity: 0; transform: translateY(-8px); }
-  `;
-  return /* @__PURE__ */ jsx(Tooltip, { label: orgId, placement: "top", hasArrow: true, children: /* @__PURE__ */ jsxs(
-    Flex,
-    {
-      align: "center",
-      cursor: "pointer",
-      onClick: onCopy,
-      _hover: { bg: "gray.100" },
-      borderRadius: "md",
-      px: 2,
-      py: 1,
-      position: "relative",
-      transition: "all 0.2s",
-      children: [
-        /* @__PURE__ */ jsxs(Text, { fontSize: "xs", color: hasCopied ? "green.500" : "gray.600", fontWeight: "normal", children: [
-          "...",
-          orgId.slice(-8)
-        ] }),
-        hasCopied && /* @__PURE__ */ jsx(
-          Box,
-          {
-            position: "absolute",
-            bottom: "100%",
-            mb: "6px",
-            px: "2",
-            py: "1",
-            fontSize: "xs",
-            bg: "gray.700",
-            color: "white",
-            borderRadius: "md",
-            animation: `${copiedAnimation} 0.9s ease-out`,
-            pointerEvents: "none",
-            children: "Copied!"
-          }
-        )
-      ]
-    }
-  ) });
-}
-function OrgPill() {
-  const org = useShellOrganization();
-  const { user } = useShellAuth();
-  const currentOrg = org?.currentOrg ?? null;
-  const organizations = org?.organizations ?? [];
-  const switchOrganization = org?.switchOrganization;
-  const loadingOrgs = org?.loadingOrgs ?? false;
-  const unselectedOrganizations = useMemo(
-    () => organizations.filter((o) => o.id !== currentOrg?.id),
-    [organizations, currentOrg?.id]
-  );
-  const selectedOrgBrandColor = useMemo(
-    () => currentOrg ? getOrganizationBrandColor(currentOrg) : null,
-    [currentOrg]
-  );
-  const selectedOrgColor = selectedOrgBrandColor || "var(--mode-primary-color, var(--color-race-red-500, #E63946))";
-  const selectedOrgMenuBg = selectedOrgBrandColor && lightenHexColor(selectedOrgBrandColor, 0.12) || "#4a4a4a";
-  if (!org) return null;
-  return /* @__PURE__ */ jsxs(Box, { mx: "4", mb: "3", children: [
-    /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", mb: "2", children: [
-      /* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "gray.500", fontWeight: "semibold", children: "ORGANIZATION" }),
-      currentOrg?.id && currentOrg.id !== user?.id && /* @__PURE__ */ jsx(OrganizationIdCopy, { orgId: currentOrg.id })
-    ] }),
-    loadingOrgs && !currentOrg ? /* @__PURE__ */ jsx(Skeleton, { height: "32px", width: "full", borderRadius: "md" }) : /* @__PURE__ */ jsxs(Menu, { gutter: 0, children: [
-      /* @__PURE__ */ jsx(
-        MenuButton,
-        {
-          as: Button,
-          rightIcon: /* @__PURE__ */ jsx(FiChevronDown, {}),
-          size: "sm",
-          width: "full",
-          bg: currentOrg?.id ? selectedOrgColor : "gray.100",
-          borderColor: currentOrg?.id ? selectedOrgColor : "gray.300",
-          color: currentOrg?.id ? "white" : "gray.700",
-          _hover: {
-            bg: currentOrg?.id ? selectedOrgColor : "gray.200",
-            color: currentOrg?.id ? "white" : "gray.900"
-          },
-          _active: {
-            bg: currentOrg?.id ? selectedOrgColor : "gray.200",
-            color: currentOrg?.id ? "white" : "gray.900"
-          },
-          _expanded: {
-            bg: currentOrg?.id ? selectedOrgColor : "gray.200",
-            color: currentOrg?.id ? "white" : "gray.900"
-          },
-          textAlign: "left",
-          justifyContent: "flex-start",
-          isDisabled: loadingOrgs && organizations.length === 0,
-          sx: currentOrg?.id ? {
-            color: "white",
-            ".chakra-button__icon": { color: "white" }
-          } : void 0,
-          children: /* @__PURE__ */ jsxs(HStack, { spacing: "2.5", minW: 0, align: "center", children: [
-            /* @__PURE__ */ jsx(
-              OrgBadge,
-              {
-                name: currentOrg?.name,
-                logoUrl: currentOrg?.logoUrl,
-                brandColor: selectedOrgBrandColor,
-                size: "20px"
-              }
-            ),
-            /* @__PURE__ */ jsx(Text, { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", children: currentOrg?.name || "No organizations" })
-          ] })
-        }
-      ),
-      /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(
-        MenuList,
-        {
-          bg: currentOrg?.id ? selectedOrgMenuBg : "gray.100",
-          borderColor: currentOrg?.id ? selectedOrgColor : "gray.300",
-          color: currentOrg?.id ? "white" : "gray.800",
-          mt: "1",
-          minW: "13rem",
-          maxH: "60vh",
-          overflowY: "auto",
-          zIndex: "modal",
-          boxShadow: "2xl",
-          children: [
-            unselectedOrganizations.map((o) => {
-              const orgBrandColor = getOrganizationBrandColor(o);
-              return /* @__PURE__ */ jsx(
-                MenuItem,
-                {
-                  onClick: () => switchOrganization?.(o.id),
-                  bg: "transparent",
-                  color: currentOrg?.id ? "white" : "inherit",
-                  _hover: {
-                    bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.2) || "#555555" : "gray.100",
-                    color: currentOrg?.id ? "white" : "gray.900"
-                  },
-                  _focus: {
-                    bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.2) || "#555555" : "gray.100",
-                    color: currentOrg?.id ? "white" : "gray.900"
-                  },
-                  _active: {
-                    bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.24) || "#5d5d5d" : "gray.200",
-                    color: currentOrg?.id ? "white" : "gray.900"
-                  },
-                  children: /* @__PURE__ */ jsxs(Flex, { justify: "space-between", align: "center", width: "100%", overflow: "hidden", children: [
-                    /* @__PURE__ */ jsxs(HStack, { minW: 0, flex: "1", spacing: "2.5", children: [
-                      /* @__PURE__ */ jsx(
-                        OrgBadge,
-                        {
-                          name: o.name,
-                          logoUrl: o.logoUrl,
-                          brandColor: orgBrandColor,
-                          size: "24px"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        Text,
-                        {
-                          overflow: "hidden",
-                          textOverflow: "ellipsis",
-                          whiteSpace: "nowrap",
-                          flex: "1",
-                          children: o.name
-                        }
-                      )
-                    ] }),
-                    /* @__PURE__ */ jsx(
-                      Text,
-                      {
-                        fontSize: "xs",
-                        color: currentOrg?.id ? "whiteAlpha.700" : "gray.500",
-                        ml: 2,
-                        flexShrink: 0,
-                        children: o.id.slice(-8)
-                      }
-                    )
-                  ] })
-                },
-                o.id
-              );
-            }),
-            /* @__PURE__ */ jsx(MenuDivider, { my: 0, borderColor: currentOrg?.id ? "whiteAlpha.300" : void 0 }),
-            /* @__PURE__ */ jsx(
-              MenuItem,
-              {
-                onClick: () => window.dispatchEvent(new CustomEvent("open-create-org")),
-                fontWeight: "bold",
-                bg: "transparent",
-                color: currentOrg?.id ? "white" : "inherit",
-                my: 0,
-                _hover: {
-                  bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.2) || "#555555" : "gray.100",
-                  color: currentOrg?.id ? "white" : "gray.900"
-                },
-                _focus: {
-                  bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.2) || "#555555" : "gray.100",
-                  color: currentOrg?.id ? "white" : "gray.900"
-                },
-                _active: {
-                  bg: currentOrg?.id ? lightenHexColor(selectedOrgBrandColor || "#E63946", 0.24) || "#5d5d5d" : "gray.200",
-                  color: currentOrg?.id ? "white" : "gray.900"
-                },
-                fontSize: "sm",
-                children: "+ New Organization"
-              }
-            )
-          ]
-        }
-      ) })
-    ] })
-  ] });
-}
-var OrgPill_default = OrgPill;
-function ModePill() {
-  const mode = useShellMode();
-  if (!mode) return null;
-  const { currentMode, modes, switchMode } = mode;
-  const modeConfig = resolveModeConfig(mode);
-  if (!modeConfig) return null;
-  const hasMultipleModes = modes.length > 1;
-  const isDisabled = !hasMultipleModes;
-  return /* @__PURE__ */ jsx(Box, { mx: "4", mb: "4", children: /* @__PURE__ */ jsxs(Menu, { gutter: 0, children: [
-    /* @__PURE__ */ jsx(
-      MenuButton,
-      {
-        as: Button,
-        leftIcon: modeConfig.icon,
-        rightIcon: /* @__PURE__ */ jsx(FiChevronDown, {}),
-        size: "sm",
-        width: "full",
-        bg: modeConfig.primaryColor,
-        borderColor: modeConfig.primaryColor,
-        color: modeConfig.white,
-        _disabled: {
-          bg: modeConfig.primaryColor,
-          borderColor: modeConfig.primaryColor,
-          color: modeConfig.white,
-          cursor: "not-allowed",
-          opacity: 1
-        },
-        isDisabled,
-        _hover: {
-          bg: modeConfig.primaryColor,
-          color: modeConfig.white
-        },
-        _active: {
-          bg: modeConfig.primaryColor,
-          color: modeConfig.white
-        },
-        children: modeConfig.name
-      }
-    ),
-    hasMultipleModes && /* @__PURE__ */ jsx(MenuList, { children: modes.map((m) => /* @__PURE__ */ jsx(
-      MenuItem,
-      {
-        onClick: () => switchMode(m.id),
-        bg: "transparent",
-        color: currentMode === m.id ? m.primaryColor : "inherit",
-        _hover: { bg: m.bgColor, color: m.primaryColor },
-        icon: m.icon,
-        children: m.name
-      },
-      m.id
-    )) })
-  ] }) });
-}
-var ModePill_default = ModePill;
-function ActivityIcon() {
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      width: "12",
-      height: "12",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx("polyline", { points: "22 12 18 12 15 21 9 3 6 12 2 12" })
-    }
-  );
-}
-function defaultEnvChip(label) {
-  if (!label) return null;
-  const lower = label.toLowerCase();
-  if (lower.includes("prod")) {
-    return { color: "#ef4444", bg: "#fee2e2", border: "#fecaca", name: label };
-  }
-  if (lower.includes("stag")) {
-    return { color: "#f97316", bg: "#ffedd5", border: "#fed7aa", name: label };
-  }
-  if (lower.includes("local") || lower.includes("dev")) {
-    return { color: "#22c55e", bg: "#dcfce7", border: "#bbf7d0", name: label };
-  }
-  return { color: "#6b7280", bg: "#f3f4f6", border: "#e5e7eb", name: label };
-}
-var PLACEHOLDER_SHA_VALUES = /* @__PURE__ */ new Set(["unknown", "n/a", "null", "undefined", ""]);
-function isMeaningfulCommit(value) {
-  if (typeof value !== "string") return false;
-  const trimmed = value.trim();
-  if (!trimmed) return false;
-  return !PLACEHOLDER_SHA_VALUES.has(trimmed.toLowerCase());
-}
-function isMeaningfulAuthor(value) {
-  if (typeof value !== "string") return false;
-  const trimmed = value.trim();
-  if (!trimmed) return false;
-  return !PLACEHOLDER_SHA_VALUES.has(trimmed.toLowerCase());
-}
-function getFirstName(value) {
-  if (!value) return "";
-  const stripped = value.replace(/<[^>]+>/g, "").trim();
-  if (!stripped) return "";
-  const [firstToken] = stripped.split(/\s+/);
-  return firstToken || stripped;
-}
-function CommitCopyButton({
-  envNode,
-  environmentLabel,
-  commit,
-  version = "",
-  commitDate = "",
-  commitAuthor = "",
-  commitLog = "",
-  onDiagnosticsClick
-}) {
-  const safeCommit = isMeaningfulCommit(commit) ? commit.trim() : "";
-  const { hasCopied, onCopy } = useClipboard(safeCommit);
-  const shortCommit = safeCommit ? safeCommit.slice(-4) : "";
-  const copiedAnimation = keyframes`
-    0% { opacity: 0; transform: translateY(6px); }
-    20% { opacity: 1; transform: translateY(0); }
-    100% { opacity: 0; transform: translateY(-8px); }
-  `;
-  const formattedDate = useMemo(() => {
-    if (!commitDate) return "";
-    const parsed = new Date(commitDate);
-    if (Number.isNaN(parsed.getTime())) return commitDate;
-    return parsed.toLocaleDateString(void 0, { month: "short", day: "numeric" });
-  }, [commitDate]);
-  const metaLine = useMemo(() => {
-    const firstName = isMeaningfulAuthor(commitAuthor) ? getFirstName(commitAuthor) : "";
-    return [formattedDate, firstName].filter(Boolean).join(" | ");
-  }, [formattedDate, commitAuthor]);
-  const normalizedCommitLog = useMemo(() => {
-    if (commitLog?.trim()) {
-      return commitLog.replace(/\r\n/g, "\n").replace(/\\n/g, "\n");
-    }
-    return "";
-  }, [commitLog]);
-  const tooltipContent = normalizedCommitLog.length > 0 ? /* @__PURE__ */ jsx(
-    Box,
-    {
-      maxW: "600px",
-      width: "min(600px, 90vw)",
-      maxH: "80vh",
-      whiteSpace: "pre-wrap",
-      overflowY: "auto",
-      overflowX: "auto",
-      fontSize: "xs",
-      fontFamily: "mono",
-      wordBreak: "break-word",
-      children: normalizedCommitLog
-    }
-  ) : void 0;
-  const envChip = useMemo(() => {
-    if (envNode) return envNode;
-    const chip = defaultEnvChip(environmentLabel);
-    if (!chip) return null;
-    return /* @__PURE__ */ jsx(
-      Box,
-      {
-        as: "span",
-        display: "inline-flex",
-        alignItems: "center",
-        px: "1.5",
-        py: "0.5",
-        borderWidth: "1px",
-        borderColor: chip.border,
-        bg: chip.bg,
-        color: chip.color,
-        borderRadius: "md",
-        fontSize: "2xs",
-        fontWeight: "600",
-        lineHeight: "1",
-        textTransform: "capitalize",
-        "aria-label": `Environment: ${chip.name}`,
-        children: chip.name
-      }
-    );
-  }, [envNode, environmentLabel]);
-  const showEnv = Boolean(envChip);
-  return /* @__PURE__ */ jsxs(
-    VStack,
-    {
-      justify: "center",
-      align: "center",
-      borderRadius: "md",
-      py: 0.5,
-      px: 1,
-      position: "relative",
-      spacing: 0,
-      textAlign: "center",
-      w: "full",
-      children: [
-        /* @__PURE__ */ jsxs(Flex, { justify: "center", align: "center", gap: 2, whiteSpace: "nowrap", children: [
-          showEnv ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(Box, { flexShrink: 0, children: /* @__PURE__ */ jsx(
-              Tooltip,
-              {
-                label: tooltipContent,
-                isDisabled: !tooltipContent,
-                hasArrow: true,
-                placement: "top-start",
-                openDelay: 150,
-                closeOnClick: false,
-                shouldWrapChildren: true,
-                modifiers: [
-                  { name: "preventOverflow", options: { padding: 16 } },
-                  { name: "offset", options: { offset: [0, 12] } }
-                ],
-                children: /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    variant: "unstyled",
-                    minW: "auto",
-                    h: "auto",
-                    p: 0,
-                    lineHeight: "1",
-                    color: "inherit",
-                    onClick: onCopy,
-                    "aria-label": "Copy commit ID",
-                    isDisabled: !safeCommit,
-                    children: envChip
-                  }
-                )
-              }
-            ) }),
-            /* @__PURE__ */ jsx(Text, { fontSize: "2xs", color: "var(--sidebar-text-muted, #CBD5E0)", flexShrink: 0, children: "|" })
-          ] }) : null,
-          shortCommit ? /* @__PURE__ */ jsx(Text, { fontSize: "2xs", color: hasCopied ? "green.500" : "var(--sidebar-text-muted, #718096)", flexShrink: 0, children: shortCommit }) : null,
-          version ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            shortCommit ? /* @__PURE__ */ jsx(Text, { fontSize: "2xs", color: "var(--sidebar-text-muted, #CBD5E0)", flexShrink: 0, children: "|" }) : null,
-            /* @__PURE__ */ jsxs(Text, { fontSize: "2xs", color: "var(--sidebar-text-muted, #718096)", flexShrink: 0, children: [
-              "v",
-              version
-            ] })
-          ] }) : null,
-          onDiagnosticsClick ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(Text, { fontSize: "2xs", color: "var(--sidebar-text-muted, #CBD5E0)", flexShrink: 0, children: "|" }),
-            /* @__PURE__ */ jsx(Tooltip, { label: "Diagnostics", hasArrow: true, placement: "top", children: /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "unstyled",
-                minW: "auto",
-                h: "auto",
-                p: 0,
-                lineHeight: "1",
-                color: "gray.400",
-                _hover: { color: "gray.600" },
-                onClick: (e) => {
-                  e.stopPropagation();
-                  onDiagnosticsClick();
-                },
-                "aria-label": "Diagnostics",
-                children: /* @__PURE__ */ jsx(Icon, { as: ActivityIcon, boxSize: 3 })
-              }
-            ) })
-          ] }) : null
-        ] }),
-        metaLine ? /* @__PURE__ */ jsx(Text, { fontSize: "2xs", color: "var(--sidebar-text-muted, #718096)", textAlign: "center", whiteSpace: "nowrap", children: metaLine }) : null,
-        hasCopied && /* @__PURE__ */ jsx(
-          Box,
-          {
-            position: "absolute",
-            bottom: "100%",
-            mb: "6px",
-            px: "2",
-            py: "1",
-            fontSize: "xs",
-            bg: "gray.700",
-            color: "white",
-            borderRadius: "md",
-            animation: `${copiedAnimation} 0.9s ease-out`,
-            pointerEvents: "none",
-            children: "Copied"
-          }
-        )
-      ]
-    }
-  );
-}
-function Sidebar({ onClose, id }) {
-  const { brandLogoSrc } = useShellChrome();
-  const navItems = useShellNavItems()?.items ?? [];
-  const footer = useShellFooter();
-  const org = useShellOrganization();
-  const currentOrg = org?.currentOrg ?? null;
-  const location = useLocation();
-  const sidebarBg = "var(--sidebar-bg, #FFFFFF)";
-  const sidebarBorderColor = "var(--sidebar-border, #E2E8F0)";
-  const [expandedMenu, setExpandedMenu] = useState(null);
-  useEffect(() => {
-    const activeMenu = navItems.find(
-      (item) => item.children && item.children.some((child) => {
-        if (!child.href) return false;
-        const childPath = child.href.split("?")[0];
-        if (!childPath) return false;
-        return location.pathname === childPath || location.pathname.startsWith(`${childPath}/`);
-      })
-    )?.name || null;
-    setExpandedMenu(activeMenu);
-  }, [location.pathname, navItems]);
-  const handleMenuToggle = (menuKey) => {
-    if (!menuKey) {
-      setExpandedMenu(null);
-      return;
-    }
-    setExpandedMenu((prev) => prev === menuKey ? null : menuKey);
-  };
-  return /* @__PURE__ */ jsxs(
-    Flex,
-    {
-      id: id || "sidebar-container",
-      transition: "3s ease",
-      bg: sidebarBg,
-      borderRight: "1px",
-      borderRightColor: sidebarBorderColor,
-      w: { base: "full", md: "var(--sidebar-width, 240px)" },
-      pos: "fixed",
-      h: "100vh",
-      direction: "column",
-      overflow: "hidden",
-      children: [
-        /* @__PURE__ */ jsxs(Flex, { alignItems: "center", mx: "8", mt: "3", mb: "2", justifyContent: "space-between", flexShrink: 0, children: [
-          /* @__PURE__ */ jsx(Box, { h: "40px", children: brandLogoSrc ? /* @__PURE__ */ jsx(BrandLogo_default, { src: brandLogoSrc, className: "h-full w-auto object-contain" }) : null }),
-          onClose ? /* @__PURE__ */ jsx(
-            IconButton,
-            {
-              display: { base: "flex", md: "none" },
-              onClick: onClose,
-              variant: "outline",
-              "aria-label": "close menu",
-              icon: /* @__PURE__ */ jsx(FiX, {})
-            }
-          ) : null
-        ] }),
-        /* @__PURE__ */ jsxs(
-          Box,
-          {
-            flex: "1",
-            overflowY: "auto",
-            css: {
-              "&::-webkit-scrollbar": { width: "8px" },
-              "&::-webkit-scrollbar-track": { background: "transparent" },
-              "&::-webkit-scrollbar-thumb": { background: "#CBD5E0", borderRadius: "4px" },
-              "&::-webkit-scrollbar-thumb:hover": { background: "#A0AEC0" }
-            },
-            children: [
-              currentOrg?.logoUrl && /* @__PURE__ */ jsx(Box, { mx: "4", mb: "3", children: /* @__PURE__ */ jsx(
-                Image,
-                {
-                  src: currentOrg.logoUrl,
-                  alt: `${currentOrg.name} logo`,
-                  maxH: "70px",
-                  w: "full",
-                  objectFit: "contain",
-                  borderRadius: "md"
-                }
-              ) }),
-              /* @__PURE__ */ jsx(OrgPill_default, {}),
-              /* @__PURE__ */ jsx(ModePill_default, {}),
-              navItems.map((link) => /* @__PURE__ */ jsx(
-                NavItem_default,
-                {
-                  icon: link.icon,
-                  brandIcon: link.brandIcon,
-                  href: link.href,
-                  subItems: link.children,
-                  badge: link.badge,
-                  subLabel: link.subLabel,
-                  action: link.action,
-                  menuKey: String(link.name),
-                  isExpanded: expandedMenu === link.name,
-                  onToggle: handleMenuToggle,
-                  isDisabled: Boolean(link.disabled),
-                  children: link.name
-                },
-                link.name
-              ))
-            ]
-          }
-        ),
-        footer && /* @__PURE__ */ jsx(
-          Box,
-          {
-            px: "1",
-            py: "1",
-            borderTop: "1px",
-            borderColor: "var(--sidebar-border, #E2E8F0)",
-            flexShrink: 0,
-            bg: sidebarBg,
-            zIndex: 1,
-            children: /* @__PURE__ */ jsxs(VStack, { align: "stretch", spacing: 2, px: "3", py: "2", textAlign: "center", children: [
-              /* @__PURE__ */ jsx(HStack, { spacing: 1, fontSize: "xs", color: "gray.600", wrap: "wrap", justify: "center", w: "full", children: footer.links.map((l, idx) => /* @__PURE__ */ jsxs(Box, { display: "inline-flex", alignItems: "center", children: [
-                idx > 0 ? /* @__PURE__ */ jsx(Text, { color: "var(--sidebar-text-muted, #929599)", mx: 1, children: "|" }) : null,
-                l.external ? /* @__PURE__ */ jsx(
-                  Link$1,
-                  {
-                    href: l.href,
-                    isExternal: true,
-                    color: "var(--sidebar-text-muted, #4A5568)",
-                    _hover: {
-                      color: "var(--sidebar-hover-text, #FFFFFF)",
-                      textDecoration: "underline"
-                    },
-                    children: l.label
-                  }
-                ) : /* @__PURE__ */ jsx(
-                  Link$1,
-                  {
-                    as: NavLink,
-                    to: l.href,
-                    color: "var(--sidebar-text-muted, #4A5568)",
-                    _hover: {
-                      color: "var(--sidebar-hover-text, #FFFFFF)",
-                      textDecoration: "underline"
-                    },
-                    children: l.label
-                  }
-                )
-              ] }, `${l.label}-${idx}`)) }),
-              (footer.version || footer.commit || footer.commitFull || footer.environmentLabel || footer.envNode) && /* @__PURE__ */ jsx(
-                CommitCopyButton,
-                {
-                  envNode: footer.envNode,
-                  environmentLabel: footer.environmentLabel,
-                  commit: footer.commitFull ?? footer.commit,
-                  version: footer.version,
-                  commitDate: footer.commitDate,
-                  commitAuthor: footer.commitAuthor,
-                  commitLog: footer.commitLog,
-                  onDiagnosticsClick: footer.onDiagnosticsClick
-                }
-              )
-            ] })
-          }
-        )
-      ]
-    }
-  );
-}
-function Footer({ buildInfo }) {
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      as: "footer",
-      px: 4,
-      py: 2,
-      borderTop: "1px solid",
-      borderColor: "gray.200",
-      fontSize: "xs",
-      color: "gray.500",
-      children: /* @__PURE__ */ jsxs(Text, { children: [
-        "politogy ",
-        buildInfo ? `\xB7 ${buildInfo}` : ""
-      ] })
-    }
-  );
-}
-function AppLayout({
-  children,
-  buildInfo,
-  modalsSlot,
-  notificationsSlot,
-  overlaySlot
-}) {
-  const [mobileOpen, setMobileOpen] = useState(false);
-  return /* @__PURE__ */ jsxs(Flex, { direction: "column", minH: "100vh", children: [
-    /* @__PURE__ */ jsx(
-      Sidebar,
-      {
-        onClose: mobileOpen ? () => setMobileOpen(false) : void 0
-      }
-    ),
-    /* @__PURE__ */ jsx(Header, { onOpen: () => setMobileOpen(true) }),
-    /* @__PURE__ */ jsxs(Box, { as: "main", flex: "1", ml: { base: 0, md: 60 }, position: "relative", overflow: "auto", children: [
-      children,
-      notificationsSlot
-    ] }),
-    buildInfo ? /* @__PURE__ */ jsx(Footer, { buildInfo }) : null,
-    modalsSlot,
-    overlaySlot
-  ] });
-}
-function TopBarBadge({ count }) {
-  if (!count || count <= 0) return null;
-  return /* @__PURE__ */ jsx(
-    Badge,
-    {
-      position: "absolute",
-      top: "-2px",
-      right: "-2px",
-      bg: "var(--topbar-badge-bg, #E63946)",
-      color: "var(--topbar-badge-fg, #FFFFFF)",
-      rounded: "full",
-      fontSize: "0.625rem",
-      fontWeight: "bold",
-      lineHeight: "1",
-      minW: "1rem",
-      h: "1rem",
-      px: "1",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      pointerEvents: "none",
-      "aria-hidden": true,
-      children: count > 9 ? "9+" : count
-    }
-  );
-}
-var TopBarIcon = forwardRef(
-  function TopBarIcon2({ slot, fallbackIcon, isSelected, badgeCount, children, ...rest }, ref) {
-    const glyphName = useTopBarIconSlotGlyph(slot);
-    const Glyph = resolveBrandGlyph(glyphName);
-    const icon = Glyph ? /* @__PURE__ */ jsx(Glyph, {}) : fallbackIcon;
-    const button = /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        ref,
-        icon,
-        variant: "ghost",
-        minW: "var(--topbar-icon-button-size, 32px)",
-        w: "var(--topbar-icon-button-size, 32px)",
-        h: "var(--topbar-icon-button-size, 32px)",
-        p: "0",
-        bg: isSelected ? "var(--topbar-icon-selected-bg, transparent)" : "transparent",
-        color: isSelected ? "var(--topbar-icon-selected-color, var(--topbar-icon-color, #64748B))" : "var(--topbar-icon-color, #64748B)",
-        _hover: {
-          bg: "var(--topbar-icon-hover-bg, transparent)",
-          color: "var(--topbar-icon-hover-color, var(--topbar-icon-color, #64748B))"
-        },
-        sx: {
-          // Normalize the glyph itself, not just its box. Covers react-icons
-          // <svg> and brand <img> alike, and pins stroke weight so one glyph
-          // can't read heavier than its neighbours.
-          "& svg, & img": {
-            width: "var(--topbar-icon-size, 20px)",
-            height: "var(--topbar-icon-size, 20px)",
-            strokeWidth: "var(--topbar-icon-stroke-width, 2)"
-          }
-        },
-        ...rest
-      }
-    );
-    if (!badgeCount && !children) return button;
-    return /* @__PURE__ */ jsxs(Box, { position: "relative", display: "inline-flex", children: [
-      button,
-      /* @__PURE__ */ jsx(TopBarBadge, { count: badgeCount ?? 0 }),
-      children
-    ] });
-  }
-);
-var SUPPORT_REQUEST_SUCCESS_MESSAGE = "Your support request was sent to Politogy leadership.";
-function splitName(value) {
-  const trimmed = String(value ?? "").trim();
-  if (!trimmed) return { firstName: "", lastName: "" };
-  const [first, ...rest] = trimmed.split(/\s+/);
-  return { firstName: first ?? "", lastName: rest.join(" ") };
-}
-function resolveSupportProfile(user) {
-  if (!user) {
-    return { firstName: "", lastName: "", email: "", phone: "", missingEmail: true, missingPhone: true };
-  }
-  const meta = user.raw.user_metadata ?? {};
-  const resolvedName = String(meta.full_name ?? meta.name ?? "").trim() || String(user.email ?? "").split("@")[0] || "";
-  const { firstName, lastName } = splitName(resolvedName);
-  const email = String(user.email ?? "").trim();
-  const phone = String(meta.phone ?? "").trim();
-  return {
-    firstName,
-    lastName,
-    email,
-    phone,
-    missingEmail: email.length === 0,
-    missingPhone: phone.length === 0
-  };
-}
-function formatTimestamp(date) {
-  return date.toLocaleString("en-US", {
-    year: "numeric",
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-    second: "2-digit",
-    hour12: true
-  });
-}
-function buildSupportRequestMessage(input) {
-  const submittedAt = input.submittedAt ?? /* @__PURE__ */ new Date();
-  const iso = submittedAt.toISOString();
-  const display = formatTimestamp(submittedAt);
-  const trimmedSearch = String(input.search ?? "").trim();
-  return [
-    "A user requested support.",
-    "",
-    `First Name: ${input.firstName.trim() || "Unknown"}`,
-    `Last Name: ${input.lastName.trim() || "Unknown"}`,
-    `Organization: ${(input.organizationName ?? "").trim() || "Unknown"}`,
-    `Email: ${input.email.trim()}`,
-    `Phone: ${input.phone.trim()}`,
-    `Submitted At (ISO): ${iso}`,
-    `Submitted At (Local): ${display}`,
-    `Page Path: ${input.pathname.trim() || "/"}`,
-    `Page Title: ${(input.pageTitle ?? "").trim() || "Unknown"}`,
-    `Query String: ${trimmedSearch || "None"}`
-  ].join("\n");
-}
-function SupportRequestButton() {
-  const support = useShellSupport();
-  const { user } = useShellAuth();
-  const org = useShellOrganization();
-  const { isOpen, onOpen, onClose } = useDisclosure();
-  const toast = useToast();
-  const profile = useMemo(() => resolveSupportProfile(user), [user]);
-  const [email, setEmail] = useState("");
-  const [phone, setPhone] = useState("");
-  const [message, setMessage] = useState("");
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  useEffect(() => {
-    if (!isOpen) return;
-    setEmail(profile.email);
-    setPhone(profile.phone);
-    setMessage("");
-    setIsSubmitting(false);
-  }, [isOpen, profile.email, profile.phone]);
-  const handleClose = useCallback(() => {
-    if (isSubmitting) return;
-    onClose();
-  }, [isSubmitting, onClose]);
-  const handleSubmit = useCallback(async () => {
-    if (!support) return;
-    const resolvedEmail = (profile.missingEmail ? email : profile.email).trim();
-    const resolvedPhone = (profile.missingPhone ? phone : profile.phone).trim();
-    if (!resolvedEmail) {
-      toast({ title: "Email required", status: "error", duration: 4e3, isClosable: true });
-      return;
-    }
-    if (!resolvedPhone) {
-      toast({ title: "Phone required", status: "error", duration: 4e3, isClosable: true });
-      return;
-    }
-    if (!user?.id) {
-      toast({
-        title: "Unable to send support request",
-        description: "You must be signed in to request support.",
-        status: "error",
-        duration: 4e3,
-        isClosable: true
-      });
-      return;
-    }
-    const context = {
-      pathname: typeof window !== "undefined" ? window.location.pathname : "/",
-      search: typeof window !== "undefined" ? window.location.search : "",
-      pageTitle: typeof document !== "undefined" ? document.title : void 0,
-      organizationName: org?.currentOrg?.name ?? void 0
-    };
-    const formatted = buildSupportRequestMessage({
-      firstName: profile.firstName,
-      lastName: profile.lastName,
-      organizationName: context.organizationName,
-      email: resolvedEmail,
-      phone: resolvedPhone,
-      pathname: context.pathname,
-      search: context.search,
-      pageTitle: context.pageTitle
-    });
-    try {
-      setIsSubmitting(true);
-      await support.submitSupportRequest({
-        email: resolvedEmail,
-        phone: resolvedPhone,
-        message: message.trim() ? `${message.trim()}
 
----
-
-${formatted}` : formatted,
-        context
-      });
-      toast({
-        title: "Support request sent",
-        description: SUPPORT_REQUEST_SUCCESS_MESSAGE,
-        status: "success",
-        duration: 5e3,
-        isClosable: true
-      });
-      onClose();
-    } catch (err) {
-      const description = err instanceof Error ? err.message : "Unable to send your support request.";
-      toast({
-        title: "Failed to request support",
-        description,
-        status: "error",
-        duration: 5e3,
-        isClosable: true
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  }, [support, profile, email, phone, message, toast, user?.id, onClose, org?.currentOrg?.name]);
-  if (!support) return null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      TopBarIcon,
-      {
-        slot: "support",
-        "aria-label": "Request support",
-        fallbackIcon: /* @__PURE__ */ jsx(LifebuoyIcon, {}),
-        onClick: onOpen
-      }
-    ),
-    /* @__PURE__ */ jsxs(Modal, { isOpen, onClose: handleClose, isCentered: true, children: [
-      /* @__PURE__ */ jsx(ModalOverlay, {}),
-      /* @__PURE__ */ jsxs(ModalContent, { children: [
-        /* @__PURE__ */ jsx(ModalHeader, { children: "Support" }),
-        /* @__PURE__ */ jsx(ModalCloseButton, { isDisabled: isSubmitting }),
-        /* @__PURE__ */ jsx(ModalBody, { children: /* @__PURE__ */ jsxs(VStack, { align: "stretch", spacing: 4, children: [
-          /* @__PURE__ */ jsx(Text, { fontSize: "sm", color: "gray.600", children: "A message will be texted and emailed with your contact information and support will reply as soon as possible. If you are a beta customer that is typically within minutes." }),
-          /* @__PURE__ */ jsx(Box, { rounded: "md", borderWidth: "1px", borderColor: "gray.200", bg: "gray.50", p: 3, children: /* @__PURE__ */ jsxs(VStack, { align: "stretch", spacing: 1, children: [
-            /* @__PURE__ */ jsxs(Text, { fontSize: "sm", children: [
-              /* @__PURE__ */ jsx("strong", { children: "Name:" }),
-              " ",
-              [profile.firstName, profile.lastName].filter(Boolean).join(" ") || "Unknown"
-            ] }),
-            /* @__PURE__ */ jsxs(Text, { fontSize: "sm", children: [
-              /* @__PURE__ */ jsx("strong", { children: "Organization:" }),
-              " ",
-              org?.currentOrg?.name ?? "Unknown"
-            ] }),
-            /* @__PURE__ */ jsxs(Text, { fontSize: "sm", children: [
-              /* @__PURE__ */ jsx("strong", { children: "Email:" }),
-              " ",
-              (profile.missingEmail ? email : profile.email) || "Missing"
-            ] }),
-            /* @__PURE__ */ jsxs(Text, { fontSize: "sm", children: [
-              /* @__PURE__ */ jsx("strong", { children: "Phone:" }),
-              " ",
-              (profile.missingPhone ? phone : profile.phone) || "Missing"
-            ] })
-          ] }) }),
-          profile.missingEmail && /* @__PURE__ */ jsxs(Box, { children: [
-            /* @__PURE__ */ jsx(Text, { fontSize: "xs", fontWeight: "600", color: "gray.700", mb: 1, children: "Email" }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "email",
-                "aria-label": "Email",
-                value: email,
-                onChange: (e) => setEmail(e.target.value),
-                placeholder: "name@example.com",
-                style: {
-                  width: "100%",
-                  padding: "8px 12px",
-                  border: "1px solid #e2e8f0",
-                  borderRadius: "6px",
-                  fontSize: "14px"
-                }
-              }
-            )
-          ] }),
-          profile.missingPhone && /* @__PURE__ */ jsxs(Box, { children: [
-            /* @__PURE__ */ jsx(Text, { fontSize: "xs", fontWeight: "600", color: "gray.700", mb: 1, children: "Phone" }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                "aria-label": "Phone",
-                value: phone,
-                onChange: (e) => setPhone(e.target.value),
-                placeholder: "(503) 555-1212",
-                style: {
-                  width: "100%",
-                  padding: "8px 12px",
-                  border: "1px solid #e2e8f0",
-                  borderRadius: "6px",
-                  fontSize: "14px"
-                }
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxs(Box, { children: [
-            /* @__PURE__ */ jsx(Text, { fontSize: "xs", fontWeight: "600", color: "gray.700", mb: 1, children: "Optional message" }),
-            /* @__PURE__ */ jsx(
-              Textarea,
-              {
-                value: message,
-                onChange: (e) => setMessage(e.target.value),
-                placeholder: "What can we help you with?",
-                rows: 3
-              }
-            )
-          ] })
-        ] }) }),
-        /* @__PURE__ */ jsxs(ModalFooter, { children: [
-          /* @__PURE__ */ jsx(Button, { variant: "ghost", mr: 3, onClick: handleClose, isDisabled: isSubmitting, children: "Cancel" }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              colorScheme: "red",
-              onClick: () => void handleSubmit(),
-              isLoading: isSubmitting,
-              loadingText: "Sending",
-              children: "Request Support"
-            }
-          )
-        ] })
-      ] })
-    ] })
-  ] });
-}
-function LifebuoyIcon() {
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "18",
-      height: "18",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" }),
-        /* @__PURE__ */ jsx("line", { x1: "4.93", y1: "4.93", x2: "9.17", y2: "9.17" }),
-        /* @__PURE__ */ jsx("line", { x1: "14.83", y1: "14.83", x2: "19.07", y2: "19.07" }),
-        /* @__PURE__ */ jsx("line", { x1: "14.83", y1: "9.17", x2: "19.07", y2: "4.93" }),
-        /* @__PURE__ */ jsx("line", { x1: "14.83", y1: "9.17", x2: "18.36", y2: "5.64" }),
-        /* @__PURE__ */ jsx("line", { x1: "4.93", y1: "19.07", x2: "9.17", y2: "14.83" })
-      ]
-    }
-  );
-}
-function ShellChrome({
-  children,
-  organization,
-  linkedAccounts,
-  support,
-  devNotesMenu,
-  myProfileHref,
-  mode,
-  navItems,
-  navigationPreference,
-  role,
-  footer,
-  brandLogoSrc,
-  headerIconsSlot,
-  organizationSettingsHref,
-  showContinueOnboarding,
-  onContinueOnboarding,
-  pageTitle,
-  breadcrumbs,
-  headerActions,
-  userAvatarUrl
-}) {
-  const chrome = useMemo(
-    () => ({
-      devNotesMenu: devNotesMenu ?? null,
-      myProfileHref: myProfileHref ?? "/my-profile",
-      brandLogoSrc,
-      headerIconsSlot,
-      organizationSettingsHref,
-      showContinueOnboarding,
-      onContinueOnboarding,
-      pageTitle,
-      breadcrumbs,
-      headerActions,
-      userAvatarUrl
-    }),
-    [
-      devNotesMenu,
-      myProfileHref,
-      brandLogoSrc,
-      headerIconsSlot,
-      organizationSettingsHref,
-      showContinueOnboarding,
-      onContinueOnboarding,
-      pageTitle,
-      breadcrumbs,
-      headerActions,
-      userAvatarUrl
-    ]
-  );
-  const navItemsValue = useMemo(
-    () => navItems ? { items: navItems } : null,
-    [navItems]
-  );
-  return /* @__PURE__ */ jsx(ShellOrgContext.Provider, { value: organization ?? null, children: /* @__PURE__ */ jsx(ShellLinkedAccountsContext.Provider, { value: linkedAccounts ?? null, children: /* @__PURE__ */ jsx(ShellSupportProviderContext.Provider, { value: support ?? null, children: /* @__PURE__ */ jsx(ShellModeContext.Provider, { value: mode ?? null, children: /* @__PURE__ */ jsx(ShellNavItemsContext.Provider, { value: navItemsValue, children: /* @__PURE__ */ jsx(ShellNavigationPreferenceContext.Provider, { value: navigationPreference ?? null, children: /* @__PURE__ */ jsx(ShellRoleContext.Provider, { value: role ?? null, children: /* @__PURE__ */ jsx(ShellFooterContext.Provider, { value: footer ?? null, children: /* @__PURE__ */ jsx(ShellChromeContext.Provider, { value: chrome, children }) }) }) }) }) }) }) }) });
+// src/lib/userDisplay.ts
+function getUserDisplayName(user) {
+  if (!user) return "User";
+  return user.profile?.full_name || user.profile?.name || user.user_metadata?.full_name || user.user_metadata?.name || (typeof user.email === "string" ? user.email.split("@")[0] : "") || user.email || "User";
 }
 
 // src/sw/registerShellPrecache.ts
@@ -3163,6 +1365,6 @@ function buildSpeculationRules(currentApp, registry) {
   return JSON.stringify(payload);
 }
 
-export { AppLayout, BrandIcon, BrandLogo, BreadcrumbBar, Card, CommitCopyButton, Footer, GlobalUiIdProvider, Header, HeaderTabBar, ModePill, NavItem, OrgPill, OrgPill as OrgSelector, PageContainer, PageHeader, ShellChrome, ShellChromeContext, ShellFooterContext, ShellLinkedAccountsContext, ShellModeContext, ShellNavItemsContext, ShellNavigationPreferenceContext, ShellOrgContext, ShellProvider, ShellRoleContext, ShellSupportProviderContext, Sidebar, SupportRequestButton, TopBarBadge, TopBarIcon, UserMenu, buildSpeculationRules, getOrganizationBadgeLetters, getOrganizationBrandColor, getUserDisplayName, hexToRgba, lightenHexColor, normalizeHexColor, politogyTheme, registerShellPrecache, useAppRegistry, useCurrentApp, useShellAuth, useShellChrome, useShellFooter, useShellLinkedAccounts, useShellMode, useShellNavItems, useShellNavigationPreference, useShellOrganization, useShellRole, useShellSupport };
+export { BrandIcon, BrandLogo, BreadcrumbBar, Card, GlobalUiIdProvider, HeaderTabBar, PageContainer, PageHeader, ShellChromeContext, ShellFooterContext, ShellLinkedAccountsContext, ShellModeContext, ShellNavItemsContext, ShellNavigationPreferenceContext, ShellOrgContext, ShellProvider, ShellRoleContext, ShellSupportProviderContext, buildSpeculationRules, getOrganizationBadgeLetters, getOrganizationBrandColor, getUserDisplayName, hexToRgba, lightenHexColor, normalizeHexColor, politogyTheme, registerShellPrecache, useAppRegistry, useCurrentApp, useShellAuth, useShellChrome, useShellFooter, useShellLinkedAccounts, useShellMode, useShellNavItems, useShellNavigationPreference, useShellOrganization, useShellRole, useShellSupport };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map