@godxjp/ui 5.0.2 → 6.0.0

package/dist/components/shell.js

@@ -1,774 +0,0 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { ChevronDown, PanelLeftOpen, PanelLeftClose, Search, Bell, SlidersHorizontal, X, Check, Clock } from 'lucide-react';
-import { useTranslation } from 'react-i18next';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import * as Dialog from '@radix-ui/react-dialog';
-import { useState, useRef, useEffect, useCallback } from 'react';
-import i18next from 'i18next';
-import 'i18next-browser-languagedetector';
-import * as Popover from '@radix-ui/react-popover';
-import * as VisuallyHidden from '@radix-ui/react-visually-hidden';
-import { Command } from 'cmdk';
-
-// src/components/shell/AppShell.tsx
-function AppShell({
-  sidebar,
-  topbar,
-  topbarLeft,
-  topbarRight,
-  logo,
-  breadcrumb,
-  footer,
-  children,
-  sidebarCollapsed = false
-}) {
-  const resolvedTopbar = topbar !== void 0 ? topbar : /* @__PURE__ */ jsxs("div", { className: "app-topbar-rail", children: [
-    logo !== void 0 && /* @__PURE__ */ jsx("div", { className: "app-topbar-logo", children: logo }),
-    topbarLeft !== void 0 && /* @__PURE__ */ jsx("div", { className: "app-topbar-left", children: topbarLeft }),
-    /* @__PURE__ */ jsx("div", { className: "app-topbar-spacer" }),
-    topbarRight !== void 0 && /* @__PURE__ */ jsx("div", { className: "app-topbar-right", children: topbarRight })
-  ] });
-  return /* @__PURE__ */ jsxs("div", { className: "app-root", "data-collapsed": sidebarCollapsed, children: [
-    /* @__PURE__ */ jsx("aside", { className: "app-sidebar", children: sidebar }),
-    /* @__PURE__ */ jsx("header", { className: "app-topbar", children: resolvedTopbar }),
-    /* @__PURE__ */ jsxs("main", { className: "app-main", children: [
-      breadcrumb !== void 0 && /* @__PURE__ */ jsx("div", { className: "app-breadcrumb", children: breadcrumb }),
-      children
-    ] }),
-    footer !== void 0 && /* @__PURE__ */ jsx("footer", { className: "app-footer", children: footer })
-  ] });
-}
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function Sidebar({
-  activeId,
-  onSelect,
-  sections,
-  product,
-  onProductClick,
-  brand,
-  collapsed = false,
-  footer
-}) {
-  const { t } = useTranslation();
-  return /* @__PURE__ */ jsxs("div", { className: "sb-root", "data-collapsed": collapsed ? "true" : void 0, style: { display: "contents" }, children: [
-    brand !== void 0 ? /* @__PURE__ */ jsx("div", { className: "sb-brand", children: brand }) : product ? /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "sb-product",
-        onClick: onProductClick,
-        "aria-label": product.name,
-        children: [
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: "sb-logo-mark",
-              style: { background: product.color },
-              children: product.name[0]?.toUpperCase() ?? "?"
-            }
-          ),
-          !collapsed && /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: "sb-product-meta col flex-1 min-w-0",
-              style: { display: "flex" },
-              children: [
-                /* @__PURE__ */ jsx("span", { className: "sb-product-name", children: product.name }),
-                /* @__PURE__ */ jsx("span", { className: "sb-product-tenant", children: product.role })
-              ]
-            }
-          ),
-          !collapsed && /* @__PURE__ */ jsx("span", { className: "sb-product-tenant shrink-0", children: /* @__PURE__ */ jsx(ChevronDown, { size: 14 }) })
-        ]
-      }
-    ) : null,
-    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: sections.map((section, i) => /* @__PURE__ */ jsxs("div", { className: "sb-section", children: [
-      section.label && !collapsed && /* @__PURE__ */ jsx("div", { className: "sb-section-label", children: section.label }),
-      /* @__PURE__ */ jsx("div", { className: "sb-nav", role: "navigation", children: section.items.map((item) => {
-        const Icon = item.icon;
-        const isActive = item.id === activeId;
-        return /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: cn("sb-nav-item"),
-            "data-active": isActive,
-            "aria-label": collapsed ? item.label : void 0,
-            "aria-current": isActive ? "page" : void 0,
-            "aria-disabled": item.disabled,
-            title: collapsed ? item.label : void 0,
-            onClick: () => !item.disabled && onSelect(item.id),
-            children: [
-              /* @__PURE__ */ jsx("span", { className: "sb-icon", children: /* @__PURE__ */ jsx(Icon, { size: 16 }) }),
-              !collapsed && /* @__PURE__ */ jsx("span", { className: "sb-label", children: item.label }),
-              !collapsed && item.badge !== void 0 && item.badge !== "" && /* @__PURE__ */ jsx("span", { className: "sb-badge", children: item.badge })
-            ]
-          },
-          item.id
-        );
-      }) })
-    ] }, section.label ?? i)) }),
-    footer && /* @__PURE__ */ jsx("div", { className: "sb-footer", children: footer })
-  ] });
-}
-function Topbar({
-  product,
-  project,
-  onProductOpen,
-  onProjectOpen,
-  onSearchOpen,
-  onTweaksOpen,
-  collapsed = false,
-  onToggleCollapsed,
-  rightSlot,
-  unread = false,
-  onNotificationsOpen,
-  user
-}) {
-  const { t } = useTranslation();
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    onToggleCollapsed && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn",
-        "aria-label": t("shell.sidebarCollapse"),
-        "aria-pressed": collapsed,
-        onClick: onToggleCollapsed,
-        children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { size: 16 }) : /* @__PURE__ */ jsx(PanelLeftClose, { size: 16 })
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "tb-switcher", children: [
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          className: "tb-chip",
-          "aria-label": product.name,
-          onClick: onProductOpen,
-          children: [
-            /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: "tb-chip-icon",
-                style: { background: product.color },
-                children: product.name[0]?.toUpperCase() ?? "?"
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: product.name }),
-            /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { size: 12 }) })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "tb-chip-sep", children: "/" }),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          className: cn("tb-chip", !project && "tb-chip-empty"),
-          "aria-label": project ? project.name : t("shell.pickProject"),
-          onClick: onProjectOpen,
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: project ? project.name : t("shell.pickProject") }),
-            /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { size: 12 }) })
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "tb-search ml-auto",
-        onClick: onSearchOpen,
-        children: [
-          /* @__PURE__ */ jsx(Search, { size: 14 }),
-          /* @__PURE__ */ jsxs("span", { children: [
-            t("common.search"),
-            "\u2026"
-          ] }),
-          /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u2318K" })
-        ]
-      }
-    ),
-    rightSlot,
-    onNotificationsOpen && /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn tb-bell",
-        "aria-label": t("topbar.notifications", { defaultValue: "Notifications" }),
-        onClick: onNotificationsOpen,
-        children: [
-          /* @__PURE__ */ jsx(Bell, { size: 16 }),
-          unread && /* @__PURE__ */ jsx("span", { className: "tb-bell-dot", "aria-hidden": true })
-        ]
-      }
-    ),
-    user,
-    onTweaksOpen && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn",
-        "aria-label": t("tweaks.title"),
-        onClick: onTweaksOpen,
-        children: /* @__PURE__ */ jsx(SlidersHorizontal, { size: 16 })
-      }
-    )
-  ] });
-}
-var SUPPORTED_LOCALES = ["ja", "en", "vi", "fil"];
-var GODX_LOCALE_STORAGE_KEY = "godx.locale";
-var i18n_default = i18next;
-
-// src/hooks/useTweaks.ts
-var STORAGE_KEY = "godx.tweaks";
-var DEFAULTS = {
-  density: "default",
-  theme: "light",
-  tenant: "godx",
-  locale: "ja",
-  sidebarCollapsed: false
-};
-function loadInitial() {
-  if (typeof window === "undefined") return DEFAULTS;
-  try {
-    const raw = window.localStorage.getItem(STORAGE_KEY);
-    const stored = raw ? JSON.parse(raw) : {};
-    const detected = i18n_default.language?.slice(0, 2) || "ja";
-    return {
-      ...DEFAULTS,
-      ...stored,
-      locale: stored.locale ?? detected
-    };
-  } catch {
-    return DEFAULTS;
-  }
-}
-function useTweaks() {
-  const [tweaks, setTweaks] = useState(loadInitial);
-  useEffect(() => {
-    try {
-      window.localStorage.setItem(STORAGE_KEY, JSON.stringify(tweaks));
-    } catch {
-    }
-  }, [tweaks]);
-  useEffect(() => {
-    const html = document.documentElement;
-    html.dataset.theme = tweaks.theme;
-    html.dataset.density = tweaks.density;
-    html.dataset.tenant = tweaks.tenant;
-    html.lang = tweaks.locale;
-  }, [tweaks.theme, tweaks.density, tweaks.tenant, tweaks.locale]);
-  useEffect(() => {
-    if (!i18n_default.isInitialized) return;
-    if (i18n_default.language?.slice(0, 2) !== tweaks.locale) {
-      void i18n_default.changeLanguage(tweaks.locale);
-      try {
-        window.localStorage.setItem(GODX_LOCALE_STORAGE_KEY, tweaks.locale);
-      } catch {
-      }
-    }
-  }, [tweaks.locale]);
-  const setTweak = useCallback((key, value) => {
-    setTweaks((prev) => ({ ...prev, [key]: value }));
-  }, []);
-  return { tweaks, setTweak, setTweaks };
-}
-function TweaksPanel({ open, onOpenChange, products = [] }) {
-  const { t } = useTranslation();
-  const { tweaks, setTweak } = useTweaks();
-  return /* @__PURE__ */ jsx(Dialog.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Portal, { children: [
-    /* @__PURE__ */ jsx(Dialog.Overlay, { className: "fixed inset-0 z-40 bg-black/30 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" }),
-    /* @__PURE__ */ jsxs(
-      Dialog.Content,
-      {
-        className: "fixed right-0 top-0 z-50 h-full w-80 bg-popover text-popover-foreground border-l border-border shadow-2xl data-[state=open]:animate-in data-[state=open]:slide-in-from-right",
-        "aria-describedby": void 0,
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-border px-4 h-12", children: [
-            /* @__PURE__ */ jsx(Dialog.Title, { className: "font-medium text-sm", children: t("tweaks.title") }),
-            /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx("button", { className: "tb-icon-btn", "aria-label": "Close", children: /* @__PURE__ */ jsx(X, { size: 14 }) }) })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "overflow-y-auto h-[calc(100%-3rem)] p-4 flex flex-col gap-6", children: [
-            /* @__PURE__ */ jsxs(Section, { label: t("tweaks.display"), children: [
-              /* @__PURE__ */ jsx(
-                Radio,
-                {
-                  label: t("tweaks.density"),
-                  value: tweaks.density,
-                  onChange: (v) => setTweak("density", v),
-                  options: [
-                    { value: "compact", label: t("tweaks.densityCompact") },
-                    { value: "default", label: t("tweaks.densityDefault") },
-                    { value: "comfortable", label: t("tweaks.densityComfortable") }
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Radio,
-                {
-                  label: t("tweaks.theme"),
-                  value: tweaks.theme,
-                  onChange: (v) => setTweak("theme", v),
-                  options: [
-                    { value: "light", label: t("tweaks.themeLight") },
-                    { value: "dark", label: t("tweaks.themeDark") }
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Toggle,
-                {
-                  label: t("shell.sidebarCollapse"),
-                  value: tweaks.sidebarCollapsed,
-                  onChange: (v) => setTweak("sidebarCollapsed", v)
-                }
-              )
-            ] }),
-            products.length > 0 && /* @__PURE__ */ jsx(Section, { label: t("tweaks.product"), children: /* @__PURE__ */ jsx(
-              Select,
-              {
-                label: t("tweaks.product"),
-                value: tweaks.tenant,
-                onChange: (v) => setTweak("tenant", v),
-                options: products.map((p) => ({ value: p.tenant, label: p.name }))
-              }
-            ) }),
-            /* @__PURE__ */ jsx(Section, { label: t("tweaks.locale"), children: /* @__PURE__ */ jsx(
-              Radio,
-              {
-                label: t("tweaks.language"),
-                value: tweaks.locale,
-                onChange: (v) => setTweak("locale", v),
-                options: SUPPORTED_LOCALES.map((code) => ({
-                  value: code,
-                  label: { ja: "\u65E5\u672C\u8A9E", en: "English", vi: "Ti\u1EBFng Vi\u1EC7t", fil: "Filipino" }[code] ?? code
-                }))
-              }
-            ) })
-          ] })
-        ]
-      }
-    )
-  ] }) });
-}
-function Section({ label, children }) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ jsx("div", { className: "text-[10px] font-medium uppercase tracking-wider text-muted-foreground", children: label }),
-    children
-  ] });
-}
-function Radio({
-  label,
-  value,
-  onChange,
-  options
-}) {
-  return /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1", children: [
-    /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-foreground", children: label }),
-    /* @__PURE__ */ jsx("div", { className: "grid auto-cols-fr grid-flow-col rounded-md border border-border overflow-hidden", children: options.map((opt) => /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        "data-active": opt.value === value,
-        onClick: () => onChange(opt.value),
-        className: "px-2 py-1 text-xs hover:bg-accent/40 data-[active=true]:bg-primary data-[active=true]:text-primary-foreground",
-        children: opt.label
-      },
-      opt.value
-    )) })
-  ] });
-}
-function Toggle({
-  label,
-  value,
-  onChange
-}) {
-  return /* @__PURE__ */ jsxs("label", { className: "flex items-center justify-between gap-2 text-xs", children: [
-    /* @__PURE__ */ jsx("span", { className: "font-medium", children: label }),
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        role: "switch",
-        "aria-checked": value,
-        onClick: () => onChange(!value),
-        className: "relative inline-flex h-5 w-9 items-center rounded-full bg-input data-[on=true]:bg-primary transition-colors",
-        "data-on": value,
-        children: /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: "inline-block h-4 w-4 transform rounded-full bg-white shadow-sm transition-transform translate-x-0.5 data-[on=true]:translate-x-4",
-            "data-on": value
-          }
-        )
-      }
-    )
-  ] });
-}
-function Select({
-  label,
-  value,
-  onChange,
-  options
-}) {
-  return /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1", children: [
-    /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-foreground", children: label }),
-    /* @__PURE__ */ jsx(
-      "select",
-      {
-        className: "input",
-        value,
-        onChange: (e) => onChange(e.target.value),
-        children: options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, children: opt.label }, opt.value))
-      }
-    )
-  ] });
-}
-function ProductSwitcher({
-  trigger,
-  activeId,
-  products = [],
-  onSelect,
-  open,
-  onOpenChange
-}) {
-  const { t } = useTranslation();
-  const [query, setQuery] = useState("");
-  const q = query.trim().toLowerCase();
-  const filtered = q ? products.filter(
-    (p) => p.name.toLowerCase().includes(q) || p.role.toLowerCase().includes(q)
-  ) : products;
-  return /* @__PURE__ */ jsxs(Popover.Root, { open, onOpenChange, children: [
-    /* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsxs(
-      Popover.Content,
-      {
-        align: "start",
-        sideOffset: 4,
-        className: "sw-pop",
-        onOpenAutoFocus: (e) => e.preventDefault(),
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "sw-pop-search", children: [
-            /* @__PURE__ */ jsx(Search, { size: 14, className: "text-muted-foreground" }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                autoFocus: true,
-                value: query,
-                onChange: (e) => setQuery(e.target.value),
-                placeholder: t("shell.searchProducts"),
-                className: "flex-1 bg-transparent outline-none"
-              }
-            ),
-            /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "esc" })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "sw-pop-list", children: [
-            /* @__PURE__ */ jsx("div", { className: "sw-pop-section", children: /* @__PURE__ */ jsxs("span", { children: [
-              t("nav.products"),
-              " \xB7 ",
-              filtered.length
-            ] }) }),
-            filtered.length === 0 ? /* @__PURE__ */ jsx("div", { className: "sw-pop-empty", children: "\u2014" }) : filtered.map((p) => {
-              const isActive = p.id === activeId;
-              return /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  type: "button",
-                  className: cn("sw-pop-item w-full text-left"),
-                  "data-active": isActive,
-                  onClick: () => {
-                    onSelect(p);
-                    setQuery("");
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        className: "sb-logo-mark",
-                        style: { background: p.color },
-                        children: p.name[0]?.toUpperCase() ?? "?"
-                      }
-                    ),
-                    /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0 flex-1", children: [
-                      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: p.name }),
-                      /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground truncate", children: p.role })
-                    ] }),
-                    /* @__PURE__ */ jsxs("span", { className: "sw-pop-item-meta", children: [
-                      p.projects.length,
-                      " \xB7 ",
-                      p.devs
-                    ] }),
-                    isActive && /* @__PURE__ */ jsx(Check, { size: 12, className: "text-primary" })
-                  ]
-                },
-                p.id
-              );
-            })
-          ] })
-        ]
-      }
-    ) })
-  ] });
-}
-function ProjectSwitcher({
-  trigger,
-  activeProductId,
-  activeProjectId,
-  recent = [],
-  products = [],
-  onSelect,
-  open,
-  onOpenChange
-}) {
-  const { t } = useTranslation();
-  const [query, setQuery] = useState("");
-  const productById = new Map(products.map((p) => [p.id, p]));
-  const recentResolved = recent.map((r) => {
-    const product = productById.get(r.productId);
-    const project = product?.projects.find((p) => p.id === r.projectId);
-    return product && project ? { product, project } : null;
-  }).filter((x) => !!x).slice(0, 3);
-  const q = query.trim().toLowerCase();
-  const filteredProducts = products.map((product) => ({
-    product,
-    projects: q ? product.projects.filter(
-      (p) => p.name.toLowerCase().includes(q) || p.stack.toLowerCase().includes(q)
-    ) : product.projects
-  })).filter((group) => group.projects.length > 0);
-  return /* @__PURE__ */ jsxs(Popover.Root, { open, onOpenChange, children: [
-    /* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsxs(
-      Popover.Content,
-      {
-        align: "start",
-        sideOffset: 4,
-        className: "sw-pop",
-        style: { width: 420 },
-        onOpenAutoFocus: (e) => e.preventDefault(),
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "sw-pop-search", children: [
-            /* @__PURE__ */ jsx(Search, { size: 14, className: "text-muted-foreground" }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                autoFocus: true,
-                value: query,
-                onChange: (e) => setQuery(e.target.value),
-                placeholder: t("shell.searchProjects"),
-                className: "flex-1 bg-transparent outline-none"
-              }
-            ),
-            /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "esc" })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "sw-pop-list", children: [
-            !q && recentResolved.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx("div", { className: "sw-pop-section", children: /* @__PURE__ */ jsx("span", { children: t("shell.recent") }) }),
-              recentResolved.map(({ product, project }) => /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  type: "button",
-                  className: "sw-pop-item w-full text-left",
-                  onClick: () => onSelect(project, product),
-                  children: [
-                    /* @__PURE__ */ jsx(Clock, { size: 12, className: "text-muted-foreground" }),
-                    /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 truncate font-mono text-xs", children: project.name }),
-                    /* @__PURE__ */ jsx("span", { className: "sw-pop-item-meta truncate", children: product.name })
-                  ]
-                },
-                `${product.id}:${project.id}`
-              ))
-            ] }),
-            filteredProducts.length === 0 && /* @__PURE__ */ jsx("div", { className: "sw-pop-empty", children: "\u2014" }),
-            filteredProducts.map(({ product, projects }) => /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsxs("div", { className: "sw-pop-section", children: [
-                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx(
-                    "span",
-                    {
-                      className: "sb-logo-mark",
-                      style: { background: product.color, width: 12, height: 12, fontSize: 8 },
-                      children: product.name[0]?.toUpperCase() ?? "?"
-                    }
-                  ),
-                  product.name
-                ] }),
-                /* @__PURE__ */ jsx("span", { children: projects.length })
-              ] }),
-              projects.map((project) => {
-                const isActive = product.id === activeProductId && project.id === activeProjectId;
-                return /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    className: cn("sw-pop-item w-full text-left"),
-                    "data-active": isActive,
-                    onClick: () => onSelect(project, product),
-                    children: [
-                      /* @__PURE__ */ jsx("span", { className: "font-mono text-xs truncate flex-1 min-w-0", children: project.name }),
-                      /* @__PURE__ */ jsx("span", { className: "sw-kind-chip", children: project.kind }),
-                      /* @__PURE__ */ jsxs("span", { className: "sw-pop-item-meta", children: [
-                        project.stack,
-                        " \xB7 ",
-                        project.devs,
-                        "d \xB7 ",
-                        project.openIssues,
-                        "\u2197 \xB7",
-                        " ",
-                        project.prs,
-                        "pr"
-                      ] }),
-                      isActive && /* @__PURE__ */ jsx(Check, { size: 12, className: "text-primary" })
-                    ]
-                  },
-                  project.id
-                );
-              })
-            ] }, product.id))
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "sw-pop-foot", children: [
-            /* @__PURE__ */ jsx("span", { children: t("shell.browseAllProducts") }),
-            /* @__PURE__ */ jsxs("span", { className: "ml-auto", children: [
-              /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u2191\u2193" }),
-              " ",
-              /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u23CE" })
-            ] })
-          ] })
-        ]
-      }
-    ) })
-  ] });
-}
-function CommandPalette({ open, onOpenChange, commands }) {
-  const { t } = useTranslation();
-  const inputRef = useRef(null);
-  useEffect(() => {
-    const handler = (e) => {
-      const isModifier = e.metaKey || e.ctrlKey;
-      if (isModifier && e.key.toLowerCase() === "k") {
-        e.preventDefault();
-        onOpenChange(!open);
-      } else if (e.key === "Escape" && open) {
-        onOpenChange(false);
-      }
-    };
-    window.addEventListener("keydown", handler);
-    return () => window.removeEventListener("keydown", handler);
-  }, [open, onOpenChange]);
-  const groups = /* @__PURE__ */ new Map();
-  for (const cmd of commands) {
-    const key = cmd.group ?? "";
-    const arr = groups.get(key) ?? [];
-    arr.push(cmd);
-    groups.set(key, arr);
-  }
-  return /* @__PURE__ */ jsx(Dialog.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Portal, { children: [
-    /* @__PURE__ */ jsx(Dialog.Overlay, { className: "fixed inset-0 z-50 bg-black/30 backdrop-blur-sm" }),
-    /* @__PURE__ */ jsxs(
-      Dialog.Content,
-      {
-        className: "fixed left-1/2 top-[20%] z-50 w-[min(560px,calc(100vw-2rem))] -translate-x-1/2 rounded-lg border border-border bg-popover text-popover-foreground shadow-2xl outline-none",
-        "aria-describedby": void 0,
-        children: [
-          /* @__PURE__ */ jsx(VisuallyHidden.Root, { children: /* @__PURE__ */ jsx(Dialog.Title, { children: t("common.search") }) }),
-          /* @__PURE__ */ jsxs(Command, { label: "Command palette", className: "flex flex-col", children: [
-            /* @__PURE__ */ jsx(
-              Command.Input,
-              {
-                ref: inputRef,
-                autoFocus: true,
-                placeholder: `${t("common.search")}\u2026`,
-                className: "w-full border-b border-border bg-transparent px-4 py-3 text-sm outline-none placeholder:text-muted-foreground"
-              }
-            ),
-            /* @__PURE__ */ jsxs(Command.List, { className: "max-h-80 overflow-y-auto p-1", children: [
-              /* @__PURE__ */ jsx(Command.Empty, { className: "px-3 py-6 text-center text-xs text-muted-foreground", children: "\u2014" }),
-              [...groups.entries()].map(([groupLabel, items]) => /* @__PURE__ */ jsx(
-                Command.Group,
-                {
-                  heading: groupLabel ? /* @__PURE__ */ jsx("span", { className: "px-2 py-1 text-[10px] uppercase tracking-wider text-muted-foreground", children: groupLabel }) : void 0,
-                  children: items.map((cmd) => /* @__PURE__ */ jsxs(
-                    Command.Item,
-                    {
-                      value: cmd.label,
-                      onSelect: () => {
-                        cmd.onSelect();
-                        onOpenChange(false);
-                      },
-                      className: "flex items-center gap-2 rounded-md px-3 py-2 text-sm cursor-pointer data-[selected=true]:bg-accent",
-                      children: [
-                        /* @__PURE__ */ jsx("span", { className: "flex-1", children: cmd.label }),
-                        cmd.hint && /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground", children: cmd.hint })
-                      ]
-                    },
-                    cmd.id
-                  ))
-                },
-                groupLabel || "default"
-              ))
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "border-t border-border px-3 py-2 text-[10px] text-muted-foreground flex items-center gap-3", children: [
-              /* @__PURE__ */ jsxs("span", { children: [
-                /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u2191\u2193" }),
-                " navigate"
-              ] }),
-              /* @__PURE__ */ jsxs("span", { children: [
-                /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u23CE" }),
-                " select"
-              ] }),
-              /* @__PURE__ */ jsxs("span", { className: "ml-auto", children: [
-                /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "esc" }),
-                " close"
-              ] })
-            ] })
-          ] })
-        ]
-      }
-    )
-  ] }) });
-}
-function PageContent({
-  title,
-  subtitle,
-  extra,
-  breadcrumb,
-  tabs,
-  children,
-  footer,
-  padding = "default",
-  header = "default",
-  className
-}) {
-  const showHeader = header !== "none" && (breadcrumb || title || subtitle || extra);
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      className: cn("page-content", className),
-      "data-padding": padding,
-      children: [
-        showHeader && /* @__PURE__ */ jsxs("header", { className: "page-content-header", children: [
-          breadcrumb && /* @__PURE__ */ jsx("div", { className: "page-content-breadcrumb", children: breadcrumb }),
-          /* @__PURE__ */ jsxs("div", { className: "page-content-titlebar", children: [
-            /* @__PURE__ */ jsxs("div", { className: "page-content-titlegroup", children: [
-              title && /* @__PURE__ */ jsx("h1", { className: "page-content-title", children: title }),
-              subtitle && /* @__PURE__ */ jsx("p", { className: "page-content-subtitle", children: subtitle })
-            ] }),
-            extra && /* @__PURE__ */ jsx("div", { className: "page-content-extra", children: extra })
-          ] }),
-          tabs && /* @__PURE__ */ jsx("div", { className: "page-content-tabs", children: tabs })
-        ] }),
-        children !== void 0 && /* @__PURE__ */ jsx("div", { className: "page-content-body", children }),
-        footer && /* @__PURE__ */ jsx("footer", { className: "page-content-footer", children: footer })
-      ]
-    }
-  );
-}
-
-export { AppShell, CommandPalette, PageContent, ProductSwitcher, ProjectSwitcher, Sidebar, Topbar, TweaksPanel };
-//# sourceMappingURL=shell.js.map
-//# sourceMappingURL=shell.js.map