@shepai/cli 1.135.3 → 1.136.0-pr396.3419613

package/dist/src/presentation/web/components/common/repository-node/repository-node.js

@@ -17,7 +17,7 @@ export function RepositoryNode({ data }) {
     const router = useRouter();
     const featureFlags = useFeatureFlags();
     const [confirmOpen, setConfirmOpen] = useState(false);
-    const actions = useRepositoryActions(data.repositoryPath ? { repositoryPath: data.repositoryPath } : null);
+    const actions = useRepositoryActions(data.repositoryPath ? { repositoryId: data.id, repositoryPath: data.repositoryPath } : null);
     const deployAction = useDeployAction(data.repositoryPath
         ? {
             targetId: data.repositoryPath,
@@ -71,15 +71,17 @@ export function RepositoryNode({ data }) {
                         e.stopPropagation();
                         data.onClick?.();
                     }
-                }, className: "nodrag bg-card flex w-[26rem] cursor-pointer flex-col overflow-hidden rounded-xl border shadow-sm", children: [_jsxs("div", { className: "flex items-center gap-3 px-4 py-3", children: [_jsx(Github, { className: "text-muted-foreground h-5 w-5 shrink-0" }), _jsx("span", { "data-testid": "repository-node-name", className: "min-w-0 truncate text-sm font-medium", children: data.name }), _jsxs("div", { className: cn('flex shrink-0 items-center gap-2', (data.repositoryPath ?? data.onAdd) && 'ml-auto'), onClick: (e) => e.stopPropagation(), children: [data.repositoryPath ? (_jsxs(_Fragment, { children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open in IDE", onClick: actions.openInIde, loading: actions.ideLoading, error: !!actions.ideError, icon: Code2, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open in IDE" })] }) }), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open in Shell", onClick: actions.openInShell, loading: actions.shellLoading, error: !!actions.shellError, icon: Terminal, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open in Shell" })] }) }), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open Folder", onClick: actions.openFolder, loading: actions.folderLoading, error: !!actions.folderError, icon: FolderOpen, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open Folder" })] }) }), _jsx(FeatureSessionsDropdown, { repositoryPath: data.repositoryPath, onCreateFromSession: handleCreateFromSession })] })) : null, data.onAdd ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { "aria-label": "Add feature", "data-testid": "repository-node-add-button", onClick: (e) => {
+                }, className: "nodrag bg-card flex w-[26rem] cursor-pointer flex-col overflow-hidden rounded-xl border shadow-sm dark:bg-neutral-800/80", children: [_jsxs("div", { className: "flex items-center gap-3 px-4 py-3", children: [_jsx(Github, { className: "text-muted-foreground h-5 w-5 shrink-0" }), _jsx("span", { "data-testid": "repository-node-name", className: "min-w-0 truncate text-sm font-medium", children: data.name }), _jsxs("div", { className: cn('flex shrink-0 items-center gap-2', (data.repositoryPath ?? data.onAdd) && 'ml-auto'), onClick: (e) => e.stopPropagation(), children: [data.repositoryPath ? (_jsxs(_Fragment, { children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open in IDE", onClick: actions.openInIde, loading: actions.ideLoading, error: !!actions.ideError, icon: Code2, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open in IDE" })] }) }), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open in Shell", onClick: actions.openInShell, loading: actions.shellLoading, error: !!actions.shellError, icon: Terminal, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open in Shell" })] }) }), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "flex items-center", children: _jsx(ActionButton, { label: "Open Folder", onClick: actions.openFolder, loading: actions.folderLoading, error: !!actions.folderError, icon: FolderOpen, iconOnly: true, variant: "ghost", size: "icon-xs" }) }) }), _jsx(TooltipContent, { children: "Open Folder" })] }) }), _jsx(FeatureSessionsDropdown, { repositoryPath: data.repositoryPath, onCreateFromSession: handleCreateFromSession })] })) : null, data.onAdd ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { "aria-label": "Add feature", "data-testid": "repository-node-add-button", onClick: (e) => {
                                                             e.stopPropagation();
                                                             data.onAdd?.();
                                                         }, className: cn('text-muted-foreground hover:bg-accent dark:hover:bg-accent/50 flex h-6 w-6 shrink-0 cursor-pointer items-center justify-center rounded-full transition-colors hover:text-blue-500', data.pulseAdd &&
-                                                            'animate-pulse-cta bg-blue-100 text-blue-500 dark:bg-blue-900/40'), children: _jsx(Plus, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Add feature" })] }) })) : null] })] }), data.branch ? (_jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-git-info", className: "text-muted-foreground border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-3 text-xs", children: [_jsxs("span", { className: "flex items-center gap-1 truncate", "data-testid": "repository-node-branch", children: [_jsx(GitBranch, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "truncate", children: data.branch })] }), data.behindCount != null && data.behindCount > 0 ? (_jsxs("span", { className: "flex shrink-0 items-center gap-1 whitespace-nowrap text-amber-500", "data-testid": "repository-node-behind", children: [_jsx(ArrowDown, { className: "h-3 w-3 shrink-0" }), data.behindCount, " behind"] })) : null] }) }), data.commitMessage ? (_jsx("div", { "data-testid": "repository-node-commit-info", className: "text-muted-foreground border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx(GitCommitHorizontal, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "min-w-0 truncate", "data-testid": "repository-node-commit-message", children: data.commitMessage }), data.committer ? (_jsxs("span", { className: "text-muted-foreground/70 ml-auto flex shrink-0 items-center gap-1", "data-testid": "repository-node-committer", children: [_jsx(User, { className: "h-3 w-3 shrink-0" }), _jsx("span", { children: data.committer })] })) : null] }) })) : null] })) : data.gitInfoStatus === 'not-a-repo' ? (
+                                                            'animate-pulse-cta bg-blue-100 text-blue-500 dark:bg-blue-900/40'), children: _jsx(Plus, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Add feature" })] }) })) : null] })] }), data.branch ? (_jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-git-info", className: "text-muted-foreground border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-3 text-xs", children: [_jsxs("span", { className: "flex items-center gap-1 truncate", "data-testid": "repository-node-branch", children: [_jsx(GitBranch, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "truncate", children: data.branch })] }), data.behindCount != null && data.behindCount > 0 ? (_jsxs("span", { className: "flex shrink-0 items-center gap-1 whitespace-nowrap text-amber-500", "data-testid": "repository-node-behind", children: [_jsx(ArrowDown, { className: "h-3 w-3 shrink-0" }), data.behindCount, " behind"] })) : null] }) }), data.commitMessage ? (_jsx("div", { "data-testid": "repository-node-commit-info", className: "text-muted-foreground border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx(GitCommitHorizontal, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "min-w-0 truncate", "data-testid": "repository-node-commit-message", children: data.commitMessage }), data.committer ? (_jsxs("span", { className: "text-muted-foreground/70 ml-auto flex shrink-0 items-center gap-1", "data-testid": "repository-node-committer", children: [_jsx(User, { className: "h-3 w-3 shrink-0" }), _jsx("span", { children: data.committer })] })) : null] }) })) : null] })) : data.gitInfoStatus === 'not-a-repo' ? (
                     /* Not a git repo — two rows for consistency with loading/ready states */
-                    _jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-not-repo", className: "text-muted-foreground border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx(FolderOpen, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "min-w-0 truncate opacity-60", children: data.repositoryPath ?? 'Unknown path' })] }) }), _jsx("div", { className: "text-muted-foreground border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs opacity-40", children: [_jsx(GitBranch, { className: "h-3 w-3 shrink-0" }), _jsx("span", { children: "Not a git repository" })] }) })] })) : data.gitInfoStatus !== 'ready' ? (
+                    _jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-not-repo", className: "text-muted-foreground border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx(FolderOpen, { className: "h-3 w-3 shrink-0" }), _jsx("span", { className: "min-w-0 truncate opacity-60", children: data.repositoryPath ?? 'Unknown path' })] }) }), _jsx("div", { className: "text-muted-foreground border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs opacity-40", children: [_jsx(GitBranch, { className: "h-3 w-3 shrink-0" }), _jsx("span", { children: "Not a git repository" })] }) })] })) : data.gitInfoStatus !== 'ready' ? (
                     /* Loading — show skeleton placeholders for both rows */
-                    _jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-git-loading", className: "border-t px-4 py-2", children: _jsxs("div", { className: "flex h-4 items-center gap-2 text-xs", children: [_jsx(GitBranch, { className: "text-muted-foreground h-3 w-3 shrink-0" }), _jsx("span", { className: "bg-muted h-3 w-20 animate-pulse rounded" })] }) }), _jsx("div", { className: "border-t px-4 py-2", children: _jsxs("div", { className: "flex h-4 items-center gap-2 text-xs", children: [_jsx(GitCommitHorizontal, { className: "text-muted-foreground h-3 w-3 shrink-0" }), _jsx("span", { className: "bg-muted h-3 w-36 animate-pulse rounded" })] }) })] })) : null, featureFlags.envDeploy && data.repositoryPath ? (_jsx("div", { "data-testid": "repository-node-dev-preview", className: "border-t px-4 py-2", onClick: (e) => e.stopPropagation(), children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [deployAction.deployError ? (_jsx("span", { className: "truncate text-xs text-red-500", children: deployAction.deployError })) : isDeploymentActive ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "mr-0.5 inline-block h-2 w-2 shrink-0 rounded-full bg-green-500" }), deployAction.url ? (_jsx("a", { href: deployAction.url, target: "_blank", rel: "noopener noreferrer", className: "truncate text-green-700 hover:underline dark:text-green-400", children: deployAction.url })) : (_jsx("span", { className: "text-muted-foreground", children: "Starting..." }))] })) : (_jsxs("span", { className: "text-muted-foreground", children: ["Run", _jsx("span", { className: "text-muted-foreground/50 ml-2 text-[10px]", children: "start local environment" })] })), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "ml-auto flex items-center", children: _jsx(ActionButton, { label: deployAction.deployError
+                    _jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "repository-node-git-loading", className: "border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex h-4 items-center gap-2 text-xs", children: [_jsx(GitBranch, { className: "text-muted-foreground h-3 w-3 shrink-0" }), _jsx("span", { className: "bg-muted h-3 w-20 animate-pulse rounded" })] }) }), _jsx("div", { className: "border-border/50 border-t px-4 py-2", children: _jsxs("div", { className: "flex h-4 items-center gap-2 text-xs", children: [_jsx(GitCommitHorizontal, { className: "text-muted-foreground h-3 w-3 shrink-0" }), _jsx("span", { className: "bg-muted h-3 w-36 animate-pulse rounded" })] }) })] })) : null, featureFlags.envDeploy && data.repositoryPath ? (_jsx("div", { "data-testid": "repository-node-dev-preview", className: "border-border/50 border-t px-4 py-2", onClick: (e) => e.stopPropagation(), children: _jsxs("div", { className: "flex items-center gap-2 text-xs", children: [deployAction.deployError ? (_jsx("span", { className: "truncate text-xs text-red-500", children: deployAction.deployError })) : isDeploymentActive ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "mr-0.5 inline-block h-2 w-2 shrink-0 rounded-full bg-green-500" }), deployAction.url ? (_jsx("a", { href: deployAction.url, target: "_blank", rel: "noopener noreferrer", className: "truncate text-green-700 hover:underline dark:text-green-400", children: deployAction.url })) : (_jsx("span", { className: "text-muted-foreground", children: "Starting..." }))] })) : (_jsxs("span", { className: "text-muted-foreground", children: ["Run", _jsx("span", { className: "text-muted-foreground/50 ml-2 text-[10px]", children: "start local environment" })] })), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: cn('ml-auto flex items-center', !isDeploymentActive &&
+                                                        !deployAction.deployError &&
+                                                        '[&_button]:text-green-600 [&_button]:hover:text-green-700 dark:[&_button]:text-green-400 dark:[&_button]:hover:text-green-300'), children: _jsx(ActionButton, { label: deployAction.deployError
                                                             ? 'Retry'
                                                             : isDeploymentActive
                                                                 ? 'Stop Dev Server'

package/dist/src/presentation/web/components/common/repository-node/use-repository-actions.d.ts

@@ -1,16 +1,20 @@
 export interface RepositoryActionsInput {
+    repositoryId?: string;
     repositoryPath: string;
 }
 export interface RepositoryActionsState {
     openInIde: () => Promise<void>;
     openInShell: () => Promise<void>;
     openFolder: () => Promise<void>;
+    syncMain: () => Promise<void>;
     ideLoading: boolean;
     shellLoading: boolean;
     folderLoading: boolean;
+    syncLoading: boolean;
     ideError: string | null;
     shellError: string | null;
     folderError: string | null;
+    syncError: string | null;
 }
 export declare function useRepositoryActions(input: RepositoryActionsInput | null): RepositoryActionsState;
 //# sourceMappingURL=use-repository-actions.d.ts.map

package/dist/src/presentation/web/components/common/repository-node/use-repository-actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-repository-actions.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/repository-node/use-repository-actions.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,sBAAsB;IACrC,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACjC,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAID,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,sBAAsB,GAAG,IAAI,GAAG,sBAAsB,CAyGjG"}
+{"version":3,"file":"use-repository-actions.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/repository-node/use-repository-actions.ts"],"names":[],"mappings":"AAQA,MAAM,WAAW,sBAAsB;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACjC,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAID,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,sBAAsB,GAAG,IAAI,GAAG,sBAAsB,CA6HjG"}

package/dist/src/presentation/web/components/common/repository-node/use-repository-actions.js

@@ -3,22 +3,27 @@ import { useState, useCallback, useRef, useEffect } from 'react';
 import { openIde } from '../../../app/actions/open-ide.js';
 import { openShell } from '../../../app/actions/open-shell.js';
 import { openFolder } from '../../../app/actions/open-folder.js';
+import { syncRepository } from '../../../app/actions/sync-repository.js';
 const ERROR_CLEAR_DELAY = 5000;
 export function useRepositoryActions(input) {
     const [ideLoading, setIdeLoading] = useState(false);
     const [shellLoading, setShellLoading] = useState(false);
     const [folderLoading, setFolderLoading] = useState(false);
+    const [syncLoading, setSyncLoading] = useState(false);
     const [ideError, setIdeError] = useState(null);
     const [shellError, setShellError] = useState(null);
     const [folderError, setFolderError] = useState(null);
+    const [syncError, setSyncError] = useState(null);
     const ideTimerRef = useRef(null);
     const shellTimerRef = useRef(null);
     const folderTimerRef = useRef(null);
+    const syncTimerRef = useRef(null);
     // Clear timers on unmount
     useEffect(() => {
         const ideRef = ideTimerRef;
         const shellRef = shellTimerRef;
         const folderRef = folderTimerRef;
+        const syncRef = syncTimerRef;
         return () => {
             if (ideRef.current)
                 clearTimeout(ideRef.current);
@@ -26,6 +31,8 @@ export function useRepositoryActions(input) {
                 clearTimeout(shellRef.current);
             if (folderRef.current)
                 clearTimeout(folderRef.current);
+            if (syncRef.current)
+                clearTimeout(syncRef.current);
         };
     }, []);
     const performAction = useCallback(async (action, setLoading, setError, timerRef, isLoading) => {
@@ -55,15 +62,19 @@ export function useRepositoryActions(input) {
     const handleOpenIde = useCallback(() => performAction(() => openIde({ repositoryPath: input.repositoryPath }), setIdeLoading, setIdeError, ideTimerRef, ideLoading), [performAction, ideLoading, input]);
     const handleOpenShell = useCallback(() => performAction(() => openShell({ repositoryPath: input.repositoryPath }), setShellLoading, setShellError, shellTimerRef, shellLoading), [performAction, shellLoading, input]);
     const handleOpenFolder = useCallback(() => performAction(() => openFolder(input.repositoryPath), setFolderLoading, setFolderError, folderTimerRef, folderLoading), [performAction, folderLoading, input]);
+    const handleSyncMain = useCallback(() => performAction(() => syncRepository(input.repositoryId ?? ''), setSyncLoading, setSyncError, syncTimerRef, syncLoading), [performAction, syncLoading, input]);
     return {
         openInIde: handleOpenIde,
         openInShell: handleOpenShell,
         openFolder: handleOpenFolder,
+        syncMain: handleSyncMain,
         ideLoading,
         shellLoading,
         folderLoading,
+        syncLoading,
         ideError,
         shellError,
         folderError,
+        syncError,
     };
 }

package/dist/src/presentation/web/components/features/control-center/control-center-empty-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"control-center-empty-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-empty-state.tsx"],"names":[],"mappings":"AAsBA,MAAM,WAAW,4BAA4B;IAC3C,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,wBAAgB,uBAAuB,CAAC,EACtC,kBAAkB,EAClB,SAAS,GACV,EAAE,4BAA4B,kDAuL9B"}
+{"version":3,"file":"control-center-empty-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-empty-state.tsx"],"names":[],"mappings":"AAyBA,MAAM,WAAW,4BAA4B;IAC3C,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,wBAAgB,uBAAuB,CAAC,EACtC,kBAAkB,EAClB,SAAS,GACV,EAAE,4BAA4B,kDAmM9B"}

package/dist/src/presentation/web/components/features/control-center/control-center-empty-state.js

@@ -1,13 +1,14 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useCallback, useEffect } from 'react';
-import { FolderOpen, Copy, Check, Loader2, CheckCircle2, AlertCircle, Terminal, ChevronDown, } from 'lucide-react';
+import { FolderOpen, Copy, Check, Loader2, CheckCircle2, AlertCircle, Terminal, ChevronDown, ExternalLink, } from 'lucide-react';
 import { cn } from '../../../lib/utils.js';
 import { pickFolder } from '../../common/add-repository-button/pick-folder.js';
 import { ReactFileManagerDialog } from '../../common/react-file-manager-dialog/index.js';
 import { useFeatureFlags } from '../../../hooks/feature-flags-context.js';
 import { isAgentSetupComplete } from '../../../app/actions/agent-setup-flag.js';
 import { checkAgentAuth } from '../../../app/actions/check-agent-auth.js';
+import { checkToolStatus } from '../../../app/actions/check-tool-status.js';
 import { WelcomeAgentSetup } from './welcome-agent-setup.js';
 const commands = ['cd ~/my-repo', 'shep feat new "sleek dashboard"'];
 export function ControlCenterEmptyState({ onRepositorySelect, className, }) {
@@ -17,6 +18,7 @@ export function ControlCenterEmptyState({ onRepositorySelect, className, }) {
     const [agentReady, setAgentReady] = useState(null);
     const [authStatus, setAuthStatus] = useState(null);
     const [cliExpanded, setCliExpanded] = useState(false);
+    const [toolStatus, setToolStatus] = useState(null);
     const { reactFileManager: useReactFileManager } = useFeatureFlags();
     useEffect(() => {
         isAgentSetupComplete().then((done) => {
@@ -27,6 +29,7 @@ export function ControlCenterEmptyState({ onRepositorySelect, className, }) {
         if (!agentReady)
             return;
         checkAgentAuth().then(setAuthStatus);
+        checkToolStatus().then(setToolStatus);
     }, [agentReady]);
     async function handlePickerClick() {
         if (loading)
@@ -74,7 +77,7 @@ export function ControlCenterEmptyState({ onRepositorySelect, className, }) {
             /* Agent setup wizard — owns its own hero */
             _jsx(WelcomeAgentSetup, { onComplete: handleAgentSetupComplete })) : (
             /* Repository step — fade in to match wizard transitions */
-            _jsxs("div", { className: "animate-in fade-in flex w-full max-w-md flex-col items-center duration-300", children: [_jsx("h1", { className: "text-foreground/90 text-center text-5xl font-extralight tracking-tight", children: "Add a project" }), _jsxs("p", { className: "text-muted-foreground mt-3 text-center text-lg leading-relaxed font-light", children: ["Add your project folder to unlock feature creation.", _jsx("br", {}), "Describe what you need \u2014 Shep handles the rest."] }), _jsx("div", { className: "mt-8", children: _jsx(AgentAuthBanner, { status: authStatus, onRetry: handleRetryAuth }) }), _jsxs("button", { type: "button", "data-testid": "empty-state-add-repository", onClick: handlePickerClick, disabled: loading, className: "bg-foreground text-background hover:bg-foreground/90 mt-10 flex w-full cursor-pointer items-center justify-center gap-2.5 rounded-xl px-6 py-4 text-base font-medium shadow-lg transition-all duration-200 hover:shadow-xl active:scale-[0.98] disabled:cursor-wait disabled:opacity-50", children: [loading ? (_jsx(Loader2, { className: "h-5 w-5 animate-spin" })) : (_jsx(FolderOpen, { className: "h-5 w-5" })), loading ? 'Opening…' : 'Choose a Folder'] }), _jsx("p", { className: "text-muted-foreground/60 mt-3 text-center text-sm", children: "Any folder works \u2014 git will be initialized automatically if needed." })] })), agentReady ? (_jsxs("div", { className: "absolute bottom-8 flex flex-col items-center", style: {
+            _jsxs("div", { className: "animate-in fade-in flex w-full max-w-md flex-col items-center duration-300", children: [_jsx("h1", { className: "text-foreground/90 text-center text-5xl font-extralight tracking-tight", children: "Add a project" }), _jsxs("p", { className: "text-muted-foreground mt-3 text-center text-lg leading-relaxed font-light", children: ["Add your project folder to unlock feature creation.", _jsx("br", {}), "Describe what you need \u2014 Shep handles the rest."] }), _jsxs("div", { className: "mt-8 flex w-full flex-col gap-3", children: [_jsx(AgentAuthBanner, { status: authStatus, onRetry: handleRetryAuth }), _jsx(ToolStatusRow, { label: "Git", status: toolStatus?.git ?? null, missingHint: "Required for all phases" }), _jsx(ToolStatusRow, { label: "GitHub CLI", status: toolStatus?.gh ?? null, missingHint: "Required for pull requests" })] }), _jsxs("button", { type: "button", "data-testid": "empty-state-add-repository", onClick: handlePickerClick, disabled: loading, className: "bg-foreground text-background hover:bg-foreground/90 mt-10 flex w-full cursor-pointer items-center justify-center gap-2.5 rounded-xl px-6 py-4 text-base font-medium shadow-lg transition-all duration-200 hover:shadow-xl active:scale-[0.98] disabled:cursor-wait disabled:opacity-50", children: [loading ? (_jsx(Loader2, { className: "h-5 w-5 animate-spin" })) : (_jsx(FolderOpen, { className: "h-5 w-5" })), loading ? 'Opening…' : 'Choose a Folder'] }), _jsx("p", { className: "text-muted-foreground/60 mt-3 text-center text-sm", children: "Any folder works \u2014 git will be initialized automatically if needed." })] })), agentReady ? (_jsxs("div", { className: "absolute bottom-8 flex flex-col items-center", style: {
                     animationDelay: '400ms',
                     animationDuration: '600ms',
                     animationFillMode: 'both',
@@ -83,24 +86,47 @@ export function ControlCenterEmptyState({ onRepositorySelect, className, }) {
                         setShowReactPicker(false);
                 }, onSelect: handleReactPickerSelect })] }));
 }
-/** Inline status pill — minimal, no background box */
+/** Status row for the AI agent (Claude Code, etc.) */
 function AgentAuthBanner({ status, onRetry, }) {
     if (!status) {
-        return (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Loader2, { className: "text-muted-foreground/50 h-3.5 w-3.5 animate-spin" }), _jsx("span", { className: "text-muted-foreground/50 text-sm", children: "Checking setup\u2026" })] }));
+        return (_jsx(ChecklistRow, { icon: _jsx(Loader2, { className: "text-muted-foreground/50 h-4 w-4 animate-spin" }), children: _jsx("span", { className: "text-muted-foreground/50 text-sm", children: "Checking setup\u2026" }) }));
     }
     if (status.installed && status.authenticated) {
-        return (_jsxs("div", { className: "animate-in fade-in flex items-center gap-2", children: [_jsx(CheckCircle2, { className: "h-4 w-4 text-emerald-500" }), _jsxs("span", { className: "text-sm text-emerald-600 dark:text-emerald-400", children: [status.label, " ready"] })] }));
+        return (_jsx(ChecklistRow, { icon: _jsx(CheckCircle2, { className: "h-4 w-4 text-emerald-500" }), children: _jsxs("span", { className: "text-sm text-emerald-600 dark:text-emerald-400", children: [status.label, " ready"] }) }));
     }
     if (!status.installed) {
-        return (_jsxs("div", { className: "flex flex-col items-center gap-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(AlertCircle, { className: "h-4 w-4 text-amber-500" }), _jsxs("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: [status.label, " not installed"] })] }), status.binaryName ? (_jsxs("code", { className: "rounded-lg bg-zinc-100 px-3 py-1.5 text-xs text-zinc-600 dark:bg-zinc-800 dark:text-zinc-400", children: ["npm install -g ", status.binaryName] })) : null, _jsx("button", { type: "button", onClick: onRetry, className: "text-xs text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: "Re-check" })] }));
+        return (_jsxs(ChecklistRow, { icon: _jsx(AlertCircle, { className: "h-4 w-4 text-amber-500" }), children: [_jsxs("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: [status.label, " not installed"] }), status.installCommand ? _jsx(CopyableCommand, { command: status.installCommand }) : null, _jsx("button", { type: "button", onClick: onRetry, className: "text-xs text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: "Re-check" })] }));
     }
-    return (_jsxs("div", { className: "flex flex-col items-center gap-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(AlertCircle, { className: "h-4 w-4 text-amber-500" }), _jsxs("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: [status.label, " needs authentication"] })] }), status.authCommand ? (_jsx("code", { className: "rounded-lg bg-zinc-100 px-3 py-1.5 text-xs text-zinc-600 dark:bg-zinc-800 dark:text-zinc-400", children: status.authCommand })) : null, _jsxs("div", { className: "flex items-center gap-3", children: [status.binaryName ? (_jsxs("button", { type: "button", "data-testid": "auth-banner-open-terminal", onClick: async () => {
+    return (_jsxs(ChecklistRow, { icon: _jsx(AlertCircle, { className: "h-4 w-4 text-amber-500" }), children: [_jsxs("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: [status.label, " needs authentication"] }), status.authCommand ? _jsx(CopyableCommand, { command: status.authCommand }) : null, _jsxs("div", { className: "flex items-center gap-3", children: [status.binaryName ? (_jsxs("button", { type: "button", "data-testid": "auth-banner-open-terminal", onClick: async () => {
                             try {
                                 const toolId = status.agentType === 'claude-code' ? 'claude-code' : status.agentType;
                                 await fetch(`/api/tools/${toolId}/launch`, { method: 'POST' });
                             }
                             catch {
-                                // best effort
+                                /* best effort */
                             }
-                        }, className: "flex items-center gap-1.5 text-xs font-medium text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: [_jsx(Terminal, { className: "h-3 w-3" }), "Open ", status.label] })) : null, _jsx("button", { type: "button", onClick: onRetry, className: "text-xs text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: "Re-check" })] })] }));
+                        }, className: "flex items-center gap-1 text-xs font-medium text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: [_jsx(Terminal, { className: "h-3 w-3" }), "Open ", status.label] })) : null, _jsx("button", { type: "button", onClick: onRetry, className: "text-xs text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: "Re-check" })] })] }));
+}
+/** Status row for system tools (git, gh) */
+function ToolStatusRow({ label, status, missingHint, }) {
+    if (!status) {
+        return (_jsx(ChecklistRow, { icon: _jsx(Loader2, { className: "text-muted-foreground/50 h-4 w-4 animate-spin" }), children: _jsxs("span", { className: "text-muted-foreground/50 text-sm", children: ["Checking ", label, "\u2026"] }) }));
+    }
+    if (status.installed) {
+        return (_jsx(ChecklistRow, { icon: _jsx(CheckCircle2, { className: "h-4 w-4 text-emerald-500" }), children: _jsxs("span", { className: "flex items-baseline gap-2", children: [_jsxs("span", { className: "text-sm text-emerald-600 dark:text-emerald-400", children: [label, " ready"] }), status.version ? (_jsxs("span", { className: "text-muted-foreground/40 text-xs", children: ["v", status.version] })) : null] }) }));
+    }
+    return (_jsxs(ChecklistRow, { icon: _jsx(AlertCircle, { className: "h-4 w-4 text-amber-500" }), children: [_jsxs("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: [label, " not found"] }), _jsx("span", { className: "text-muted-foreground/50 text-xs", children: missingHint }), status.installCommand ? _jsx(CopyableCommand, { command: status.installCommand }) : null, status.installUrl ? (_jsxs("a", { href: status.installUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 text-xs text-amber-600 underline underline-offset-2 hover:text-amber-800 dark:text-amber-400", children: ["Docs ", _jsx(ExternalLink, { className: "h-3 w-3" })] })) : null] }));
+}
+/** Checklist row: icon pinned left, children stacked vertically and fill width */
+function ChecklistRow({ icon, children }) {
+    return (_jsxs("div", { className: "animate-in fade-in flex items-start gap-2.5", children: [_jsx("div", { className: "mt-0.5 shrink-0", children: icon }), _jsx("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: children })] }));
+}
+/** Compact copyable command block — fills available row width */
+function CopyableCommand({ command }) {
+    const [copied, setCopied] = useState(false);
+    return (_jsxs("button", { type: "button", onClick: async () => {
+            await navigator.clipboard.writeText(command);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }, className: "group/cmd flex cursor-pointer items-center justify-between gap-2 rounded-md bg-zinc-100 py-1 pr-2 pl-2.5 text-left transition-colors hover:bg-zinc-200 dark:bg-zinc-800 dark:hover:bg-zinc-700", children: [_jsx("code", { className: "min-w-0 truncate text-[11px] leading-relaxed text-zinc-600 dark:text-zinc-300", children: command }), copied ? (_jsx(Check, { className: "h-3 w-3 shrink-0 text-emerald-500" })) : (_jsx(Copy, { className: "h-3 w-3 shrink-0 text-zinc-400 opacity-0 transition-opacity group-hover/cmd:opacity-100" }))] }));
 }

package/dist/src/presentation/web/components/features/control-center/control-center-empty-state.stories.d.ts

@@ -3,6 +3,22 @@ import { ControlCenterEmptyState } from './control-center-empty-state.js';
 declare const meta: Meta<typeof ControlCenterEmptyState>;
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
+/** All tools installed — the happy path */
+export declare const AllToolsReady: Story;
+/** Git is missing — blocks all workflow phases */
+export declare const GitMissing: Story;
+/** GitHub CLI is missing — PR features unavailable */
+export declare const GhCliMissing: Story;
+/** Both git and gh are missing */
+export declare const BothToolsMissing: Story;
+/** Claude Code not installed */
+export declare const ClaudeCodeNotInstalled: Story;
+/** Cursor CLI not installed */
+export declare const CursorCliNotInstalled: Story;
+/** Gemini CLI not installed */
+export declare const GeminiCliNotInstalled: Story;
+/** Agent not installed + tools missing — worst case */
+export declare const EverythingMissing: Story;
+/** With callback — for interaction testing */
 export declare const WithCallback: Story;
 //# sourceMappingURL=control-center-empty-state.stories.d.ts.map

package/dist/src/presentation/web/components/features/control-center/control-center-empty-state.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"control-center-empty-state.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-empty-state.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAEvE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,uBAAuB,CAc9C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAC"}
+{"version":3,"file":"control-center-empty-state.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-empty-state.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAEvE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,uBAAuB,CAc9C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA+FnC,2CAA2C;AAC3C,eAAO,MAAM,aAAa,EAAE,KAG3B,CAAC;AAEF,kDAAkD;AAClD,eAAO,MAAM,UAAU,EAAE,KAGxB,CAAC;AAEF,sDAAsD;AACtD,eAAO,MAAM,YAAY,EAAE,KAG1B,CAAC;AAEF,kCAAkC;AAClC,eAAO,MAAM,gBAAgB,EAAE,KAG9B,CAAC;AAEF,gCAAgC;AAChC,eAAO,MAAM,sBAAsB,EAAE,KAGpC,CAAC;AAEF,+BAA+B;AAC/B,eAAO,MAAM,qBAAqB,EAAE,KAGnC,CAAC;AAEF,+BAA+B;AAC/B,eAAO,MAAM,qBAAqB,EAAE,KAGnC,CAAC;AAEF,uDAAuD;AACvD,eAAO,MAAM,iBAAiB,EAAE,KAG/B,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAC"}

package/dist/src/presentation/web/components/features/control-center/control-center-empty-state.stories.js

@@ -12,9 +12,118 @@ const meta = {
     ],
 };
 export default meta;
-export const Default = {
+const agentReady = {
+    agentType: 'claude-code',
+    installed: true,
+    authenticated: true,
+    label: 'Claude Code',
+    binaryName: 'claude',
+    installCommand: 'curl -fsSL https://claude.ai/install.sh | bash',
+    authCommand: null,
+};
+const claudeNotInstalled = {
+    agentType: 'claude-code',
+    installed: false,
+    authenticated: false,
+    label: 'Claude Code',
+    binaryName: 'claude',
+    installCommand: 'curl -fsSL https://claude.ai/install.sh | bash',
+    authCommand: 'Install Claude Code first',
+};
+const cursorNotInstalled = {
+    agentType: 'cursor',
+    installed: false,
+    authenticated: false,
+    label: 'Cursor CLI',
+    binaryName: 'cursor-agent',
+    installCommand: 'curl https://cursor.com/install -fsS | bash',
+    authCommand: 'Install Cursor CLI first',
+};
+const geminiNotInstalled = {
+    agentType: 'gemini-cli',
+    installed: false,
+    authenticated: false,
+    label: 'Gemini CLI',
+    binaryName: 'gemini',
+    installCommand: 'npm install -g @google/gemini-cli',
+    authCommand: 'Install Gemini CLI first',
+};
+const gitReady = {
+    installed: true,
+    version: '2.43.0',
+    installCommand: 'sudo apt-get install -y git',
+    installUrl: 'https://git-scm.com',
+};
+const gitMissing = {
+    installed: false,
+    version: null,
+    installCommand: 'sudo apt-get install -y git',
+    installUrl: 'https://git-scm.com',
+};
+const ghReady = {
+    installed: true,
+    version: '2.40.1',
+    installCommand: 'sudo apt install gh -y',
+    installUrl: 'https://cli.github.com',
+};
+const ghMissing = {
+    installed: false,
+    version: null,
+    installCommand: 'sudo apt install gh -y',
+    installUrl: 'https://cli.github.com',
+};
+function setMocks(agent, git, gh) {
+    return () => {
+        const win = globalThis;
+        win.__mockAgentAuth = agent;
+        win.__mockToolStatus = { git, gh };
+        return () => {
+            delete win.__mockAgentAuth;
+            delete win.__mockToolStatus;
+        };
+    };
+}
+/** All tools installed — the happy path */
+export const AllToolsReady = {
+    args: {},
+    beforeEach: setMocks(agentReady, gitReady, ghReady),
+};
+/** Git is missing — blocks all workflow phases */
+export const GitMissing = {
+    args: {},
+    beforeEach: setMocks(agentReady, gitMissing, ghReady),
+};
+/** GitHub CLI is missing — PR features unavailable */
+export const GhCliMissing = {
+    args: {},
+    beforeEach: setMocks(agentReady, gitReady, ghMissing),
+};
+/** Both git and gh are missing */
+export const BothToolsMissing = {
+    args: {},
+    beforeEach: setMocks(agentReady, gitMissing, ghMissing),
+};
+/** Claude Code not installed */
+export const ClaudeCodeNotInstalled = {
+    args: {},
+    beforeEach: setMocks(claudeNotInstalled, gitReady, ghReady),
+};
+/** Cursor CLI not installed */
+export const CursorCliNotInstalled = {
+    args: {},
+    beforeEach: setMocks(cursorNotInstalled, gitReady, ghReady),
+};
+/** Gemini CLI not installed */
+export const GeminiCliNotInstalled = {
+    args: {},
+    beforeEach: setMocks(geminiNotInstalled, gitReady, ghReady),
+};
+/** Agent not installed + tools missing — worst case */
+export const EverythingMissing = {
     args: {},
+    beforeEach: setMocks(claudeNotInstalled, gitMissing, ghMissing),
 };
+/** With callback — for interaction testing */
 export const WithCallback = {
     args: {
         onRepositorySelect: (path) => {

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"features-canvas.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMvF,OAAO,KAAK,EAAE,eAAe,EAAmB,MAAM,kCAAkC,CAAC;AAEzF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAG9E,MAAM,MAAM,cAAc,GAAG,eAAe,GAAG,kBAAkB,CAAC;AAElE,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,eAAe,CAAC,EAAE,QAAQ,CAAC;IAC3B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACtE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,QAAQ,CAAC;IACjC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAmBD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,iBAAiB,EACjB,eAAe,EACf,aAAa,EACb,YAAY,EACZ,SAAS,EACT,WAAW,EACX,WAAW,EACX,YAAY,EACZ,SAAS,EACT,eAAe,EACf,OAAO,EACP,UAAU,GACX,EAAE,mBAAmB,2CA2HrB"}
+{"version":3,"file":"features-canvas.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAMvF,OAAO,KAAK,EAAE,eAAe,EAAmB,MAAM,kCAAkC,CAAC;AAEzF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAG9E,MAAM,MAAM,cAAc,GAAG,eAAe,GAAG,kBAAkB,CAAC;AAElE,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,eAAe,CAAC,EAAE,QAAQ,CAAC;IAC3B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACtE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,QAAQ,CAAC;IACjC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAmBD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,iBAAiB,EACjB,eAAe,EACf,aAAa,EACb,YAAY,EACZ,SAAS,EACT,WAAW,EACX,WAAW,EACX,YAAY,EACZ,SAAS,EACT,eAAe,EACf,OAAO,EACP,UAAU,GACX,EAAE,mBAAmB,2CA4HrB"}

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.js

@@ -60,5 +60,5 @@ export function FeaturesCanvas({ nodes, edges, selectedFeatureId, defaultViewpor
     }, [isEmpty]);
     const fallbackEmptyState = isEmpty && !emptyState ? (_jsx(EmptyState, { title: "No features yet", description: "Get started by creating your first feature.", action: _jsxs(Button, { onClick: onAddFeature, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "New Feature"] }) })) : null;
     const overlayContent = emptyState ?? fallbackEmptyState;
-    return (_jsxs("div", { "data-testid": isEmpty ? 'features-canvas-empty' : 'features-canvas', "data-no-drawer-close": true, className: "dark:bg-background pointer-events-auto relative h-full w-full bg-[#f6f7f8]", children: [_jsxs(ReactFlow, { nodes: enrichedNodes, edges: edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, onConnect: onConnect, onNodesChange: onNodesChange, onNodeClick: onNodeClick, onPaneClick: onPaneClick, onMoveStart: onCanvasDrag, onMoveEnd: onMoveEnd, defaultViewport: defaultViewport ?? FALLBACK_VIEWPORT, nodesDraggable: false, nodesConnectable: false, elementsSelectable: false, proOptions: { hideAttribution: true }, children: [_jsx(Background, { variant: BackgroundVariant.Dots, gap: 24, size: 1, color: "#b8bcc4", className: "dark:[&_circle]:!fill-white/[0.1]" }), !isEmpty && (_jsx(Controls, { showInteractive: false, children: onResetViewport ? _jsx(ResetButton, { onResetViewport: onResetViewport }) : null })), toolbar] }), showOverlay && overlayContent ? (_jsx("div", { className: cn('pointer-events-none absolute inset-0 z-10 flex items-center justify-center transition-opacity duration-300', overlayExiting ? 'opacity-0' : 'animate-in fade-in opacity-100 duration-200'), children: _jsx("div", { className: "pointer-events-auto h-full w-full", children: overlayContent }) })) : null] }));
+    return (_jsxs("div", { "data-testid": isEmpty ? 'features-canvas-empty' : 'features-canvas', "data-no-drawer-close": true, className: "dark:bg-background pointer-events-auto relative h-full w-full bg-[#f6f7f8]", children: [_jsxs(ReactFlow, { nodes: enrichedNodes, edges: edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, onConnect: onConnect, onNodesChange: onNodesChange, onNodeClick: onNodeClick, onPaneClick: onPaneClick, onMoveStart: onCanvasDrag, onMoveEnd: onMoveEnd, defaultViewport: defaultViewport ?? FALLBACK_VIEWPORT, nodesDraggable: false, nodesConnectable: false, elementsSelectable: false, proOptions: { hideAttribution: true }, className: "[&_.react-flow__pane]:!cursor-default", children: [_jsx(Background, { variant: BackgroundVariant.Dots, gap: 24, size: 1, color: "#b8bcc4", className: "dark:[&_circle]:!fill-white/[0.1]" }), !isEmpty && (_jsx(Controls, { showInteractive: false, children: onResetViewport ? _jsx(ResetButton, { onResetViewport: onResetViewport }) : null })), toolbar] }), showOverlay && overlayContent ? (_jsx("div", { className: cn('pointer-events-none absolute inset-0 z-10 flex items-center justify-center transition-opacity duration-300', overlayExiting ? 'opacity-0' : 'animate-in fade-in opacity-100 duration-200'), children: _jsx("div", { className: "pointer-events-auto h-full w-full", children: overlayContent }) })) : null] }));
 }

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.stories.d.ts

@@ -17,4 +17,5 @@ export declare const InteractiveWithRepository: Story;
 export declare const WithSavedViewport: Story;
 export declare const ZoomedOutViewport: Story;
 export declare const FastModeFeatures: Story;
+export declare const FullSpectrum: Story;
 //# sourceMappingURL=features-canvas.stories.d.ts.map

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"features-canvas.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAcrC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAwKnC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAK5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KASzB,CAAC;AAoDF,eAAO,MAAM,mCAAmC,EAAE,KAKjD,CAAC;AA4BF,eAAO,MAAM,gCAAgC,EAAE,KAO9C,CAAC;AA0DF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAiDF,eAAO,MAAM,oBAAoB,EAAE,KAQlC,CAAC;AAqGF,eAAO,MAAM,oCAAoC,EAAE,KAKlD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAMvC,CAAC;AAIF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAsEF,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC"}
+{"version":3,"file":"features-canvas.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAcrC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAyNnC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAK5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KASzB,CAAC;AAoDF,eAAO,MAAM,mCAAmC,EAAE,KAKjD,CAAC;AA4BF,eAAO,MAAM,gCAAgC,EAAE,KAO9C,CAAC;AA0DF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAiDF,eAAO,MAAM,oBAAoB,EAAE,KAQlC,CAAC;AAqGF,eAAO,MAAM,oCAAoC,EAAE,KAKlD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAMvC,CAAC;AAIF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAsEF,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AAoYF,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC"}