@shipit-ai/cli 1.167.0 → 1.168.0

package/dist/src/presentation/web/components/features/tools/tool-card.js

@@ -1,16 +1,21 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useTransition } from 'react';
-import { LoaderCircle, Rocket, Download, Monitor, Terminal, GitBranch, CircleX, Circle, CircleCheck, Package, } from 'lucide-react';
+import { LoaderCircle, Rocket, Download, CircleX, Circle, CircleCheck, Package, Info, AlertTriangle, } from 'lucide-react';
 import { Button } from '../../ui/button.js';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../ui/tooltip.js';
 import { cn } from '../../../lib/utils.js';
 import { ToolDetailDrawer } from './tool-detail-drawer.js';
-const TAG_CONFIG = {
-    ide: { label: 'IDE', icon: Monitor },
-    'cli-agent': { label: 'CLI Agent', icon: Terminal },
-    vcs: { label: 'VCS', icon: GitBranch },
-    terminal: { label: 'Terminal', icon: Terminal },
+/*
+ * Tag labels for the TOOL card "Tag" micro-label row.
+ * The tool-detail drawer keeps its own richer tag config (with icons) for its
+ * detail view. This map is intentionally small — just label mapping.
+ */
+const TAG_LABELS = {
+    ide: 'IDE',
+    'cli-agent': 'CLI Agent',
+    vcs: 'VCS',
+    terminal: 'Terminal',
 };
 export function ToolCard({ tool, onRefresh, className }) {
     const [drawerOpen, setDrawerOpen] = useState(false);
@@ -34,9 +39,13 @@ export function ToolCard({ tool, onRefresh, className }) {
         setAutoStartInstall(tool.autoInstall);
         setDrawerOpen(true);
     }
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-testid": "tool-card", onClick: handleCardClick, className: cn('bg-card group flex h-30 w-full cursor-pointer flex-col rounded-lg border p-3 transition-shadow hover:shadow-md', className), children: [_jsxs("div", { className: "mb-2 flex items-start justify-between gap-2", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [tool.iconUrl ? (_jsx("img", { src: tool.iconUrl, alt: "", width: 20, height: 20, className: "shrink-0 dark:invert" })) : (_jsx(Package, { className: "text-muted-foreground h-5 w-5 shrink-0" })), _jsx("h3", { "data-testid": "tool-card-name", className: "truncate text-sm font-bold", children: tool.name })] }), _jsx("div", { "data-testid": "tool-card-tags", className: "flex shrink-0 items-center gap-1", children: tool.tags.map((tag) => {
-                                    const config = TAG_CONFIG[tag] ?? { label: tag, icon: Monitor };
-                                    const TagIcon = config.icon;
-                                    return (_jsxs("span", { className: "text-muted-foreground/70 inline-flex items-center gap-0.5 text-[9px]", children: [_jsx(TagIcon, { className: "h-2.5 w-2.5" }), config.label] }, tag));
-                                }) })] }), _jsx("p", { "data-testid": "tool-card-summary", className: "text-muted-foreground mt-1 truncate text-xs", children: tool.summary }), _jsxs("div", { className: "mt-auto flex items-center justify-between pt-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [isError && tool.status.status === 'error' ? (_jsxs("span", { className: "flex items-center gap-1 truncate text-[10px] text-red-600 dark:text-red-400", title: tool.status.errorMessage, children: [_jsx(CircleX, { className: "h-3 w-3 shrink-0" }), tool.status.errorMessage ?? 'Error'] })) : isInstalled ? (_jsxs("span", { className: "flex items-center gap-1 text-[10px] text-emerald-600 dark:text-emerald-400", children: [_jsx(CircleCheck, { className: "h-3 w-3" }), "Installed"] })) : (_jsxs("span", { className: "text-muted-foreground flex items-center gap-1 text-[10px]", children: [_jsx(Circle, { className: "h-3 w-3" }), "Not installed"] })), tool.required ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "rounded bg-amber-100 px-1.5 py-0.5 text-[9px] font-medium text-amber-700 dark:bg-amber-900/50 dark:text-amber-400", children: "Required" }) }), _jsx(TooltipContent, { side: "top", children: "This tool is required for ShipIT to function properly" })] }) })) : null] }), _jsx("div", { className: "flex items-center gap-1", children: isInstalled && canLaunch ? (_jsxs(Button, { size: "sm", variant: "outline", onClick: handleLaunch, disabled: isPending, "aria-label": `Launch ${tool.name}`, "data-testid": "tool-card-launch-button", className: "h-7 cursor-pointer rounded-md px-3 text-xs", children: [isPending ? (_jsx(LoaderCircle, { className: "me-1 h-3 w-3 animate-spin" })) : (_jsx(Rocket, { className: "me-1 h-3 w-3" })), "Launch"] })) : !isInstalled && !isError ? (_jsxs(Button, { size: "sm", variant: "default", onClick: handleInstallClick, "aria-label": `Install ${tool.name}`, "data-testid": "tool-card-install-button", className: "h-7 cursor-pointer rounded-md px-3 text-xs", children: [_jsx(Download, { className: "me-1 h-3 w-3" }), "Install"] })) : null })] })] }), _jsx(ToolDetailDrawer, { tool: tool, open: drawerOpen, onClose: () => setDrawerOpen(false), onRefresh: onRefresh, autoStart: autoStartInstall })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-testid": "tool-card", onClick: handleCardClick, className: cn('bg-card editorial-shadow group flex w-full cursor-pointer flex-col gap-4 rounded-xl p-5', 'transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md hover:ring-slate-300 dark:hover:ring-slate-600', className), children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [_jsx("div", { className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-lg bg-slate-100 p-2 ring-1 ring-slate-200/50 dark:bg-slate-800 dark:ring-slate-700/50", children: tool.iconUrl ? (_jsx("img", { src: tool.iconUrl, alt: "", width: 28, height: 28, className: "h-full w-full" })) : (_jsx(Package, { className: "text-muted-foreground h-full w-full" })) }), _jsxs("div", { className: "min-w-0", children: [_jsx("h3", { "data-testid": "tool-card-name", className: "text-foreground truncate text-sm leading-tight font-bold tracking-tight", children: tool.name }), tool.author ? (_jsxs("div", { className: "mt-1 flex items-center gap-1.5", children: [_jsx("span", { "data-testid": "tool-card-vendor-label", className: "text-[9px] font-bold tracking-wider text-slate-400 uppercase", children: "Vendor" }), _jsx("span", { "data-testid": "tool-card-vendor", className: "text-muted-foreground truncate text-xs font-medium", children: tool.author })] })) : tool.tags.length > 0 ? (_jsxs("div", { className: "mt-1 flex items-center gap-1.5", children: [_jsx("span", { className: "text-[9px] font-bold tracking-wider text-slate-400 uppercase", children: "Tag" }), _jsx("span", { "data-testid": "tool-card-tags", className: "text-muted-foreground truncate text-xs font-medium", children: tool.tags.map((tag) => TAG_LABELS[tag] ?? tag).join(' · ') })] })) : null] })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [isError && tool.status.status === 'error' ? (_jsxs("span", { className: "flex items-center gap-1 text-[10px] font-medium text-red-600 dark:text-red-400", title: tool.status.errorMessage, children: [_jsx(CircleX, { className: "h-3 w-3 shrink-0" }), "Error"] })) : isInstalled ? (_jsxs("span", { className: "flex items-center gap-1 text-[10px] font-medium text-emerald-600 dark:text-emerald-400", children: [_jsx(CircleCheck, { className: "h-3 w-3" }), "Installed"] })) : (_jsxs("span", { className: "text-muted-foreground flex items-center gap-1 text-[10px] font-medium", children: [_jsx(Circle, { className: "h-3 w-3" }), "Not installed"] })), tool.required ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "shrink-0 rounded-full bg-amber-100 px-2 py-0.5 text-[9px] font-bold tracking-wider text-amber-700 uppercase dark:bg-amber-900/40 dark:text-amber-400", children: "Required" }) }), _jsx(TooltipContent, { side: "top", children: "This tool is required for ShipIT to function properly" })] }) })) : null] })] }), _jsx("p", { "data-testid": "tool-card-summary", className: "text-muted-foreground -mt-2 line-clamp-2 text-xs leading-relaxed", children: tool.summary }), _jsx("div", { className: "mt-auto flex flex-col gap-1.5", children: isInstalled && canLaunch ? (_jsxs(Button, { variant: "default", onClick: handleLaunch, disabled: isPending, "aria-label": `Launch ${tool.name}`, "data-testid": "tool-card-launch-button", className: "h-9 w-full cursor-pointer rounded-lg text-xs font-bold tracking-wide transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md", children: [isPending ? (_jsx(LoaderCircle, { className: "me-1 h-3.5 w-3.5 animate-spin" })) : (_jsx(Rocket, { className: "me-1 h-3.5 w-3.5" })), "Launch"] })) : !isInstalled && !isError ? (_jsxs(Button, { variant: "default", onClick: handleInstallClick, "aria-label": `Install ${tool.name}`, "data-testid": "tool-card-install-button", className: "h-9 w-full cursor-pointer rounded-lg text-xs font-bold tracking-wide transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md", children: [_jsx(Download, { className: "me-1 h-3.5 w-3.5" }), "Install"] })) : isError ? (_jsxs(Button, { variant: "outline", onClick: (e) => {
+                                e.stopPropagation();
+                                setAutoStartInstall(false);
+                                setDrawerOpen(true);
+                            }, "aria-label": `View error details for ${tool.name}`, "data-testid": "tool-card-error-button", className: "h-9 w-full cursor-pointer rounded-lg border-red-300 text-xs font-bold tracking-wide text-red-600 transition-all duration-300 hover:-translate-y-0.5 hover:bg-red-50 hover:shadow-md dark:border-red-900 dark:text-red-400 dark:hover:bg-red-950/30", children: [_jsx(AlertTriangle, { className: "me-1 h-3.5 w-3.5" }), "View Error"] })) : (_jsxs(Button, { variant: "outline", onClick: (e) => {
+                                e.stopPropagation();
+                                setAutoStartInstall(false);
+                                setDrawerOpen(true);
+                            }, "aria-label": `View details for ${tool.name}`, "data-testid": "tool-card-details-button", className: "h-9 w-full cursor-pointer rounded-lg text-xs font-bold tracking-wide transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md", children: [_jsx(Info, { className: "me-1 h-3.5 w-3.5" }), "View Details"] })) })] }), _jsx(ToolDetailDrawer, { tool: tool, open: drawerOpen, onClose: () => setDrawerOpen(false), onRefresh: onRefresh, autoStart: autoStartInstall })] }));
 }

package/dist/src/presentation/web/components/features/tools/tool-detail-drawer.js

@@ -82,7 +82,7 @@ export function ToolDetailDrawer({ tool, open, onClose, onRefresh, autoStart, })
             void onRefresh();
         }
     }, [status, onRefresh]);
-    const header = (_jsxs("div", { className: "flex flex-col gap-1.5 pe-6", children: [_jsxs("div", { className: "flex items-center gap-2", children: [tool.iconUrl ? (_jsx("img", { src: tool.iconUrl, alt: "", width: 24, height: 24, className: "shrink-0 dark:invert" })) : (_jsx(Package, { className: "text-muted-foreground h-6 w-6 shrink-0" })), _jsx("h2", { className: "text-base font-bold", children: tool.name }), _jsx(StatusBadge, { status: tool.status.status })] }), _jsx("div", { className: "flex items-center gap-2", children: tool.tags.map((tag) => {
+    const header = (_jsxs("div", { className: "flex flex-col gap-1.5 pe-6", children: [_jsxs("div", { className: "flex items-center gap-2", children: [tool.iconUrl ? (_jsx("img", { src: tool.iconUrl, alt: "", width: 24, height: 24, className: "shrink-0" })) : (_jsx(Package, { className: "text-muted-foreground h-6 w-6 shrink-0" })), _jsx("h2", { className: "text-base font-bold", children: tool.name }), _jsx(StatusBadge, { status: tool.status.status })] }), _jsx("div", { className: "flex items-center gap-2", children: tool.tags.map((tag) => {
                     const config = TAG_CONFIG[tag] ?? { label: tag, icon: Monitor };
                     const TagIcon = config.icon;
                     return (_jsxs("span", { className: "text-muted-foreground/70 inline-flex items-center gap-0.5 text-[10px]", children: [_jsx(TagIcon, { className: "h-3 w-3" }), config.label] }, tag));

package/dist/src/presentation/web/components/features/tools/tools-page-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tools-page-client.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/tools/tools-page-client.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iEAAiE,CAAC;AAEhG,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAYD,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,oBAAoB,2CA+EvF"}
+{"version":3,"file":"tools-page-client.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/tools/tools-page-client.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iEAAiE,CAAC;AAEhG,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAYD,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,oBAAoB,2CAkIvF"}

package/dist/src/presentation/web/components/features/tools/tools-page-client.js

@@ -28,5 +28,10 @@ export function ToolsPageClient({ tools: initialTools, className }) {
         }
     }, []);
     const filtered = tools.filter(TAB_FILTER[activeTab]);
-    return (_jsxs("div", { "data-testid": "tools-page-client", className: cn('space-y-4', className), children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Wrench, { className: "text-muted-foreground h-4 w-4" }), _jsx("h1", { className: "text-sm font-bold tracking-tight", children: "Tools" }), _jsxs("span", { className: "text-muted-foreground text-[10px]", children: [tools.filter((t) => t.status.status === 'available').length, "/", tools.length, " installed"] })] }), _jsxs(Tabs, { value: activeTab, onValueChange: (value) => setActiveTab(value), "data-testid": "tools-page-tabs", children: [_jsxs(TabsList, { className: "h-7", children: [_jsx(TabsTrigger, { value: "all", "data-testid": "tools-tab-all", className: "px-2.5 text-xs", children: "All" }), _jsx(TabsTrigger, { value: "ide", "data-testid": "tools-tab-ide", className: "px-2.5 text-xs", children: "IDEs" }), _jsx(TabsTrigger, { value: "cli-agent", "data-testid": "tools-tab-cli-agent", className: "px-2.5 text-xs", children: "CLI Agents" }), _jsx(TabsTrigger, { value: "vcs", "data-testid": "tools-tab-vcs", className: "px-2.5 text-xs", children: "Version Control" }), _jsx(TabsTrigger, { value: "terminal", "data-testid": "tools-tab-terminal", className: "px-2.5 text-xs", children: "Terminals" })] }), _jsx(TabsContent, { value: activeTab, className: "mt-3", children: filtered.length === 0 ? (_jsxs("div", { "data-testid": "tools-page-empty", className: "text-muted-foreground flex flex-col items-center justify-center py-12 text-center", children: [_jsx(Wrench, { className: "mb-2 h-6 w-6 opacity-20" }), _jsx("p", { className: "text-xs", children: "No tools in this category." })] })) : (_jsx("div", { "data-testid": "tools-page-grid", className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4", children: filtered.map((tool) => (_jsx(ToolCard, { tool: tool, onRefresh: refreshTools }, tool.id))) })) })] })] }));
+    const installedCount = tools.filter((t) => t.status.status === 'available').length;
+    return (_jsxs("div", { "data-testid": "tools-page-client", className: cn('space-y-8', className), children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-[10px] font-bold tracking-[0.2em] text-slate-400 uppercase", children: "Developer Portal" }) }), _jsxs("div", { className: "flex items-baseline gap-3", children: [_jsx("h1", { className: "text-foreground text-3xl font-black tracking-tight", children: "Tools" }), _jsxs("span", { className: "text-muted-foreground text-sm font-medium", children: [installedCount, " of ", tools.length, " installed"] })] })] }), _jsxs(Tabs, { value: activeTab, onValueChange: (value) => setActiveTab(value), "data-testid": "tools-page-tabs", children: [_jsxs(TabsList, { "data-editorial": "true", className: "bg-card editorial-shadow h-10 p-1", children: [_jsx(TabsTrigger, { value: "all", "data-testid": "tools-tab-all", className: "cursor-pointer px-4 text-xs font-bold", children: "All" }), _jsx(TabsTrigger, { value: "ide", "data-testid": "tools-tab-ide", className: "cursor-pointer px-4 text-xs font-bold", children: "IDEs" }), _jsx(TabsTrigger, { value: "cli-agent", "data-testid": "tools-tab-cli-agent", className: "cursor-pointer px-4 text-xs font-bold", children: "CLI Agents" }), _jsx(TabsTrigger, { value: "vcs", "data-testid": "tools-tab-vcs", className: "cursor-pointer px-4 text-xs font-bold", children: "Version Control" }), _jsx(TabsTrigger, { value: "terminal", "data-testid": "tools-tab-terminal", className: "cursor-pointer px-4 text-xs font-bold", children: "Terminals" })] }), _jsx(TabsContent, { value: activeTab, className: "mt-6", children: filtered.length === 0 ? (_jsxs("div", { "data-testid": "tools-page-empty", className: "text-muted-foreground flex flex-col items-center justify-center py-16 text-center", children: [_jsx(Wrench, { className: "mb-3 h-8 w-8 opacity-20" }), _jsx("p", { className: "text-sm", children: "No tools in this category." })] })) : (_jsx("div", { "data-testid": "tools-page-grid", 
+                            // Editorial density: 3 columns max so cards stay wide enough to
+                            // give the Stitch "magazine" feel. Previously xl:grid-cols-4 which
+                            // squeezed cards and reduced background-vs-card contrast.
+                            className: "grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3", children: filtered.map((tool) => (_jsx(ToolCard, { tool: tool, onRefresh: refreshTools }, tool.id))) })) })] })] }));
 }

package/dist/src/presentation/web/components/layouts/app-sidebar/app-sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/layouts/app-sidebar/app-sidebar.tsx"],"names":[],"mappings":"AA2CA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAI/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,YAAY,EAAE,iBAAiB,CAAC;IAEhC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EAEZ,cAAc,GACf,EAAE,eAAe,2CAyQjB"}
+{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/layouts/app-sidebar/app-sidebar.tsx"],"names":[],"mappings":"AA0CA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAI/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,YAAY,EAAE,iBAAiB,CAAC;IAEhC,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EAEZ,cAAc,GACf,EAAE,eAAe,2CAsRjB"}

package/dist/src/presentation/web/components/layouts/app-sidebar/app-sidebar.js

@@ -4,7 +4,7 @@ import { useMemo } from 'react';
 import { usePathname } from 'next/navigation';
 import { Home, Moon, Sun, Volume2, VolumeOff, Zap, ZapOff, Wrench, Puzzle, Settings, } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
-import { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarMenu, SidebarMenuItem, SidebarMenuButton, SidebarRail, useSidebar, } from '../../ui/sidebar.js';
+import { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarMenu, SidebarMenuItem, SidebarMenuButton, useSidebar, } from '../../ui/sidebar.js';
 import { ScrollArea } from '../../ui/scroll-area.js';
 import { SidebarNavItem } from '../../common/sidebar-nav-item/index.js';
 import { SidebarCollapseToggle } from '../../common/sidebar-collapse-toggle/index.js';
@@ -60,50 +60,46 @@ export function AppSidebar({ features, featureFlags, onFeatureClick, }) {
                 .filter((g) => g.items.length > 0),
         }));
     }, [features, t]);
-    return (_jsxs(Sidebar, { "data-testid": "app-sidebar", "data-no-drawer-close": true, collapsible: "icon", side: i18n.dir() === 'rtl' ? 'right' : 'left', children: [_jsx(SidebarHeader, { children: _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs("div", { className: "flex h-8 items-center group-data-[collapsible=icon]:justify-center", children: [showExpanded ? (_jsxs("div", { className: [
-                                            'flex min-w-0 flex-1 items-center gap-2 overflow-hidden px-2',
-                                            'transition-opacity duration-200 ease-out',
-                                            expandedVisible ? 'opacity-100' : 'opacity-0',
-                                        ].join(' '), "aria-hidden": !expandedVisible, children: [_jsx(ShipitAiLogo, { className: "shrink-0 drop-shadow-[0_0_4px_rgba(34,211,238,0.4)]", size: 28, variant: versionData.isDev ? 'dev' : 'default' }), _jsx("span", { className: "truncate text-sm font-semibold tracking-tight", children: "ShipIT" }), _jsx(VersionBadge, { version: versionData.version, branch: versionData.branch || undefined, commitHash: versionData.commitHash || undefined, isDev: versionData.isDev, packageName: versionData.packageName, description: versionData.description, instancePath: versionData.instancePath || undefined })] })) : null, _jsx(SidebarCollapseToggle, { className: "shrink-0 transition-all duration-200" })] }) }), _jsx(SidebarNavItem, { icon: Home, label: t('navigation.controlCenter'), href: "/", active: pathname === '/' }), _jsx(SidebarNavItem, { icon: Wrench, label: t('navigation.tools'), href: "/tools", active: pathname === '/tools' }), featureFlags.skills ? (_jsx(SidebarNavItem, { icon: Puzzle, label: t('navigation.skills'), href: "/skills", active: pathname === '/skills' })) : null, _jsx(SidebarNavItem, { icon: Settings, label: t('navigation.settings'), href: "/settings", active: pathname === '/settings' })] }) }), _jsx(SidebarContent, { children: showExpanded ? (_jsx("div", { className: [
+    return (_jsxs(Sidebar, { "data-testid": "app-sidebar", "data-no-drawer-close": true, collapsible: "icon", side: i18n.dir() === 'rtl' ? 'right' : 'left', children: [_jsx(SidebarHeader, { children: _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs("div", { className: "flex h-10 items-center px-2 group-data-[collapsible=icon]:justify-center", children: [_jsx(ShipitAiLogo, { className: "drop-shadow-[0_0_4px_rgba(34,211,238,0.4)]", size: 32, variant: versionData.isDev ? 'dev' : 'default', isOpen: Boolean(showExpanded && expandedVisible) }), showExpanded && expandedVisible ? (_jsx(VersionBadge, { version: versionData.version, branch: versionData.branch || undefined, commitHash: versionData.commitHash || undefined, isDev: versionData.isDev, packageName: versionData.packageName, description: versionData.description, instancePath: versionData.instancePath || undefined })) : null] }) }), _jsx(SidebarNavItem, { icon: Home, label: t('navigation.controlCenter'), href: "/", active: pathname === '/' }), _jsx(SidebarNavItem, { icon: Wrench, label: t('navigation.tools'), href: "/tools", active: pathname === '/tools' }), featureFlags.skills ? (_jsx(SidebarNavItem, { icon: Puzzle, label: t('navigation.skills'), href: "/skills", active: pathname === '/skills' })) : null, _jsx(SidebarNavItem, { icon: Settings, label: t('navigation.settings'), href: "/settings", active: pathname === '/settings' })] }) }), _jsx(SidebarContent, { children: showExpanded ? (_jsx("div", { className: [
                         'flex min-h-0 flex-1 flex-col overflow-hidden transition-opacity duration-200 ease-out',
                         '[&_[data-sidebar=group-label]]:!mt-0 [&_[data-sidebar=group-label]]:!opacity-100 [&_[data-sidebar=group-label]]:!transition-none',
                         expandedVisible ? 'opacity-100' : 'opacity-0',
-                    ].join(' '), children: repoGroups.length > 0 && (_jsxs(_Fragment, { children: [_jsx(SidebarSectionHeader, { label: t('sidebar.features') }), _jsx(ScrollArea, { className: "min-h-0 flex-1", children: repoGroups.map(({ repoPath, repoName, featureCount, statusGroups }) => (_jsx(RepoGroup, { repoName: repoName, featureCount: featureCount, children: statusGroups.map(({ statusKey, label, items }) => (_jsx(FeatureStatusGroup, { label: label, count: items.length, children: items.map((feature) => (_jsx(FeatureListItem, { name: feature.name, status: feature.status, startedAt: feature.startedAt, duration: feature.duration, agentType: feature.agentType, modelId: feature.modelId, onClick: onFeatureClick ? () => onFeatureClick(feature.featureId) : undefined }, feature.featureId))) }, statusKey))) }, repoPath))) })] })) })) : null }), _jsx(SidebarFooter, { className: "border-t p-2", children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsx("div", { className: "flex items-center gap-1", children: _jsxs(TooltipProvider, { children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { className: "w-auto flex-none", onClick: (e) => {
-                                                        const currentResolved = theme === 'system' ? resolvedTheme : theme;
-                                                        const goingToDark = currentResolved !== 'dark';
-                                                        const newTheme = theme === 'system'
-                                                            ? resolvedTheme === 'dark'
-                                                                ? 'light'
-                                                                : 'dark'
-                                                            : theme === 'dark'
-                                                                ? 'light'
-                                                                : 'dark';
-                                                        if (goingToDark) {
-                                                            toggleOnSound.play();
-                                                        }
-                                                        else {
-                                                            toggleOffSound.play();
-                                                        }
-                                                        const prefersReducedMotion = typeof window !== 'undefined' &&
-                                                            window.matchMedia('(prefers-reduced-motion: reduce)').matches;
-                                                        if (!('startViewTransition' in document) || prefersReducedMotion) {
-                                                            setTheme(newTheme);
-                                                            return;
-                                                        }
-                                                        document.documentElement.style.setProperty('--x', `${e.clientX}px`);
-                                                        document.documentElement.style.setProperty('--y', `${e.clientY}px`);
-                                                        document.startViewTransition(() => {
-                                                            setTheme(newTheme);
-                                                        });
-                                                    }, "aria-label": resolvedTheme === 'dark'
+                    ].join(' '), children: repoGroups.length > 0 && (_jsxs(_Fragment, { children: [_jsx(SidebarSectionHeader, { label: t('sidebar.features') }), _jsx(ScrollArea, { className: "min-h-0 flex-1", children: repoGroups.map(({ repoPath, repoName, featureCount, statusGroups }) => (_jsx(RepoGroup, { repoName: repoName, featureCount: featureCount, children: statusGroups.map(({ statusKey, label, items }) => (_jsx(FeatureStatusGroup, { label: label, count: items.length, children: items.map((feature) => (_jsx(FeatureListItem, { name: feature.name, status: feature.status, startedAt: feature.startedAt, duration: feature.duration, agentType: feature.agentType, modelId: feature.modelId, onClick: onFeatureClick ? () => onFeatureClick(feature.featureId) : undefined }, feature.featureId))) }, statusKey))) }, repoPath))) })] })) })) : null }), _jsx(SidebarFooter, { className: "border-t border-slate-200/50 p-2 dark:border-slate-800/50", children: _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { className: "w-auto flex-none", onClick: (e) => {
+                                                            const currentResolved = theme === 'system' ? resolvedTheme : theme;
+                                                            const goingToDark = currentResolved !== 'dark';
+                                                            const newTheme = theme === 'system'
+                                                                ? resolvedTheme === 'dark'
+                                                                    ? 'light'
+                                                                    : 'dark'
+                                                                : theme === 'dark'
+                                                                    ? 'light'
+                                                                    : 'dark';
+                                                            if (goingToDark) {
+                                                                toggleOnSound.play();
+                                                            }
+                                                            else {
+                                                                toggleOffSound.play();
+                                                            }
+                                                            const prefersReducedMotion = typeof window !== 'undefined' &&
+                                                                window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+                                                            if (!('startViewTransition' in document) || prefersReducedMotion) {
+                                                                setTheme(newTheme);
+                                                                return;
+                                                            }
+                                                            document.documentElement.style.setProperty('--x', `${e.clientX}px`);
+                                                            document.documentElement.style.setProperty('--y', `${e.clientY}px`);
+                                                            document.startViewTransition(() => {
+                                                                setTheme(newTheme);
+                                                            });
+                                                        }, "aria-label": resolvedTheme === 'dark'
+                                                            ? t('sidebar.switchToLight')
+                                                            : t('sidebar.switchToDark'), children: [_jsx(Sun, { className: "h-4 w-4 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" }), _jsx(Moon, { className: "absolute h-4 w-4 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" })] }) }), _jsx(TooltipContent, { side: "top", children: resolvedTheme === 'dark'
                                                         ? t('sidebar.switchToLight')
-                                                        : t('sidebar.switchToDark'), children: [_jsx(Sun, { className: "h-4 w-4 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" }), _jsx(Moon, { className: "absolute h-4 w-4 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" })] }) }), _jsx(TooltipContent, { side: "top", children: resolvedTheme === 'dark'
-                                                    ? t('sidebar.switchToLight')
-                                                    : t('sidebar.switchToDark') })] }), !collapsed && (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(SidebarMenuButton, { className: "w-auto flex-none", onClick: () => {
-                                                        clickSound.play();
-                                                        toggleSound();
-                                                    }, "aria-label": soundEnabled ? t('sidebar.muteSounds') : t('sidebar.unmuteSounds'), children: soundEnabled ? (_jsx(Volume2, { className: "h-4 w-4" })) : (_jsx(VolumeOff, { className: "h-4 w-4" })) }) }), _jsx(TooltipContent, { side: "top", children: soundEnabled ? t('sidebar.muteSounds') : t('sidebar.unmuteSounds') })] })), !collapsed && (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(SidebarMenuButton, { className: "w-auto flex-none", onClick: () => {
-                                                        clickSound.play();
-                                                        toggleAnimations();
-                                                    }, "aria-label": animationsEnabled ? 'Disable animations' : 'Enable animations', children: animationsEnabled ? (_jsx(Zap, { className: "h-4 w-4" })) : (_jsx(ZapOff, { className: "h-4 w-4" })) }) }), _jsx(TooltipContent, { side: "top", children: animationsEnabled ? 'Disable animations' : 'Enable animations' })] }))] }) }) }) }) }), _jsx(SidebarRail, {})] }));
+                                                        : t('sidebar.switchToDark') })] }) }), _jsx(SidebarCollapseToggle, { className: "flex-none transition-all duration-200" })] }) }), !collapsed && (_jsx(SidebarMenuItem, { children: _jsx("div", { className: "flex items-center gap-1", children: _jsxs(TooltipProvider, { children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(SidebarMenuButton, { className: "w-auto flex-none", onClick: () => {
+                                                            clickSound.play();
+                                                            toggleSound();
+                                                        }, "aria-label": soundEnabled ? t('sidebar.muteSounds') : t('sidebar.unmuteSounds'), children: soundEnabled ? (_jsx(Volume2, { className: "h-4 w-4" })) : (_jsx(VolumeOff, { className: "h-4 w-4" })) }) }), _jsx(TooltipContent, { side: "top", children: soundEnabled ? t('sidebar.muteSounds') : t('sidebar.unmuteSounds') })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(SidebarMenuButton, { className: "w-auto flex-none", onClick: () => {
+                                                            clickSound.play();
+                                                            toggleAnimations();
+                                                        }, "aria-label": animationsEnabled ? 'Disable animations' : 'Enable animations', children: animationsEnabled ? (_jsx(Zap, { className: "h-4 w-4" })) : (_jsx(ZapOff, { className: "h-4 w-4" })) }) }), _jsx(TooltipContent, { side: "top", children: animationsEnabled ? 'Disable animations' : 'Enable animations' })] })] }) }) }))] }) })] }));
 }

package/dist/src/presentation/web/components/ui/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,IAAI,6GAQT,CAAC;AAGF,QAAA,MAAM,UAAU,6GAIf,CAAC;AAGF,QAAA,MAAM,SAAS,6GAQd,CAAC;AAGF,QAAA,MAAM,eAAe,6GAIpB,CAAC;AAGF,QAAA,MAAM,WAAW,6GAIhB,CAAC;AAGF,QAAA,MAAM,UAAU,6GAIf,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,eAAe,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,QAAA,MAAM,IAAI,6GAQT,CAAC;AAGF,QAAA,MAAM,UAAU,6GAIf,CAAC;AAGF,QAAA,MAAM,SAAS,6GAQd,CAAC;AAGF,QAAA,MAAM,eAAe,6GAIpB,CAAC;AAGF,QAAA,MAAM,WAAW,6GAIhB,CAAC;AAGF,QAAA,MAAM,UAAU,6GAIf,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,eAAe,EAAE,WAAW,EAAE,CAAC"}

package/dist/src/presentation/web/components/ui/card.js

@@ -1,7 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { cn } from '../../lib/utils.js';
-const Card = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('bg-card text-card-foreground rounded-xl border shadow', className), ...props })));
+/*
+ * Card — shadcn primitive extended with Stitch's editorial-shadow utility.
+ * The `editorial-shadow` class (globals.css) replaces the old `shadow` class
+ * with a subtle shadow + ring combination that gives cards a "lifted" look
+ * and renders consistently against the editorial surface palette in both
+ * light and dark modes. The `border` class stays for explicit border visibility
+ * in dense grids; editorial-shadow's ring provides the soft lift on top.
+ */
+const Card = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('bg-card text-card-foreground editorial-shadow rounded-xl border', className), ...props })));
 Card.displayName = 'Card';
 const CardHeader = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('flex flex-col space-y-1.5 p-6', className), ...props })));
 CardHeader.displayName = 'CardHeader';

package/dist/src/presentation/web/components/ui/drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAC;AAIjD,iBAAS,MAAM,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAE9E;AAED,iBAAS,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAExF;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAEtF;AAED,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpF;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAQtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,SAAoB,EACpB,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAChD,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,2CAiCA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQ/F;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,GAClB,CAAC"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAC;AAIjD,iBAAS,MAAM,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAE9E;AAED,iBAAS,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAExF;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAEtF;AAED,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpF;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAWtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,SAAoB,EACpB,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAChD,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,2CAuCA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQ/F;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,GAClB,CAAC"}

package/dist/src/presentation/web/components/ui/drawer.js

@@ -16,10 +16,16 @@ function DrawerClose({ ...props }) {
     return _jsx(DrawerPrimitive.Close, { "data-slot": "drawer-close", ...props });
 }
 function DrawerOverlay({ className, ...props }) {
-    return (_jsx(DrawerPrimitive.Overlay, { "data-slot": "drawer-overlay", className: cn('fixed inset-0 z-50 bg-black/50', className), ...props }));
+    return (_jsx(DrawerPrimitive.Overlay, { "data-slot": "drawer-overlay", className: cn('fixed inset-0 z-50 bg-black/40 backdrop-blur-[2px] dark:bg-black/50', className), ...props }));
 }
 function DrawerContent({ className, children, direction = 'bottom', showCloseButton = true, ...props }) {
-    return (_jsx(DrawerPortal, { children: _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn('bg-background fixed z-50 flex flex-col shadow-lg', direction === 'bottom' && 'inset-x-0 bottom-0 mb-24 rounded-t-lg border-t', direction === 'top' && 'inset-x-0 top-0 mt-24 rounded-b-lg border-b', direction === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l', direction === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r', className), style: {
+    return (_jsx(DrawerPortal, { children: _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn(
+            // Editorial drawer: glass-blur backdrop in light mode for a polished
+            // semi-transparent feel that lets underlying content bleed through.
+            // In dark mode, the solid card surface (#1e293b) against the darker
+            // overlay already looks layered, so we use bg-card directly.
+            // editorial-shadow provides the subtle ring+shadow lift on the panel edge.
+            'editorial-shadow fixed z-50 flex flex-col', 'bg-white/80 backdrop-blur-xl dark:bg-[#1e293bd9]', direction === 'bottom' && 'inset-x-0 bottom-0 mb-24 rounded-t-lg border-t', direction === 'top' && 'inset-x-0 top-0 mt-24 rounded-b-lg border-b', direction === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l', direction === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r', className), style: {
                 '--initial-transform': 'calc(100% + 8px)',
                 // Override vaul's user-select:none on [data-vaul-drawer] so text is selectable
                 userSelect: 'text',

package/dist/src/presentation/web/lib/path-sanitizers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"path-sanitizers.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/path-sanitizers.ts"],"names":[],"mappings":"AAsCA;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAMvD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,YAAY,CAAC,iBAAiB,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,GAAG,OAAO,CAIrF;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,CACxC,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,SAAS,MAAM,EAAE,GAC9B,MAAM,GAAG,IAAI,CAWf;AAUD;;GAEG;AACH,wBAAsB,mBAAmB,CAAC,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAO3E;AAED;;;;;GAKG;AACH,wBAAsB,+BAA+B,CACnD,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,SAAS,MAAM,EAAE,GAC9B,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAcxB"}
+{"version":3,"file":"path-sanitizers.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/path-sanitizers.ts"],"names":[],"mappings":"AAsCA;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAMvD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,YAAY,CAAC,iBAAiB,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,GAAG,OAAO,CAIrF;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,CACxC,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,SAAS,MAAM,EAAE,GAC9B,MAAM,GAAG,IAAI,CAWf;AAUD;;GAEG;AACH,wBAAsB,mBAAmB,CAAC,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAW3E;AAED;;;;;GAKG;AACH,wBAAsB,+BAA+B,CACnD,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,SAAS,MAAM,EAAE,GAC9B,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAcxB"}

package/dist/src/presentation/web/lib/path-sanitizers.js

@@ -107,7 +107,11 @@ export function realpathWithinAllowedRoots(candidate, allowedRoots) {
  */
 export async function realpathOrNullAsync(p) {
     try {
-        // codeql[js/path-injection] -- this function IS the sanitizer: callers gate access via isWithinRoot containment checks on the resolved result
+        // SECURITY: this function IS the sanitizer — realpath() is CodeQL's recommended
+        // remediation for path injection. Callers gate access via isWithinRoot
+        // containment checks on the resolved result. Alert js/path-injection #28
+        // dismissed as false positive (CodeQL flagged the sanitizer itself due to
+        // the try/catch null-return path).
         return await realpath(p);
     }
     catch {