@shepai/cli 1.135.3 → 1.136.0

package/dist/src/presentation/web/app/actions/check-agent-auth.d.ts

@@ -8,6 +8,8 @@ export interface AgentAuthStatus {
     label: string;
     /** CLI binary name (e.g. "claude", "gemini") */
     binaryName: string | null;
+    /** Shell command to install the tool (e.g. "npm install -g @anthropic-ai/claude-code") */
+    installCommand: string | null;
     /** Instructions to authenticate if not authenticated */
     authCommand: string | null;
 }

package/dist/src/presentation/web/app/actions/check-agent-auth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"check-agent-auth.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/check-agent-auth.ts"],"names":[],"mappings":"AAWA,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,+CAA+C;IAC/C,SAAS,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,aAAa,EAAE,OAAO,CAAC;IACvB,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,wDAAwD;IACxD,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AA6FD;;;GAGG;AACH,wBAAsB,cAAc,IAAI,OAAO,CAAC,eAAe,CAAC,CAiF/D"}
+{"version":3,"file":"check-agent-auth.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/check-agent-auth.ts"],"names":[],"mappings":"AAWA,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,+CAA+C;IAC/C,SAAS,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,aAAa,EAAE,OAAO,CAAC;IACvB,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,0FAA0F;IAC1F,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,wDAAwD;IACxD,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AA6FD;;;GAGG;AACH,wBAAsB,cAAc,IAAI,OAAO,CAAC,eAAe,CAAC,CAwF/D"}

package/dist/src/presentation/web/app/actions/check-agent-auth.js

@@ -114,6 +114,7 @@ export async function checkAgentAuth() {
             authenticated: false,
             label: 'Unknown',
             binaryName: null,
+            installCommand: null,
             authCommand: null,
         };
     }
@@ -128,16 +129,19 @@ export async function checkAgentAuth() {
             authenticated: true,
             label,
             binaryName: null,
+            installCommand: null,
             authCommand: null,
         };
     }
-    // Check if tool is installed
+    // Check if tool is installed (also grab install command from metadata)
     let installed = false;
+    let installCommand = null;
     try {
         const useCase = resolve('ListToolsUseCase');
         const tools = await useCase.execute();
         const tool = tools.find((t) => t.id === toolId);
         installed = tool?.status.status === 'available';
+        installCommand = tool?.installCommand ?? null;
     }
     catch {
         installed = false;
@@ -149,6 +153,7 @@ export async function checkAgentAuth() {
             authenticated: false,
             label,
             binaryName,
+            installCommand,
             authCommand: binaryName ? `Install ${label} first` : null,
         };
     }
@@ -161,6 +166,7 @@ export async function checkAgentAuth() {
             authenticated: false,
             label,
             binaryName,
+            installCommand,
             authCommand: binaryName,
         };
     }
@@ -175,6 +181,7 @@ export async function checkAgentAuth() {
         authenticated,
         label,
         binaryName,
+        installCommand,
         authCommand: authenticated ? null : binaryName,
     };
 }

package/dist/src/presentation/web/app/actions/check-tool-status.d.ts

@@ -0,0 +1,14 @@
+export interface ToolStatusEntry {
+    installed: boolean;
+    version: string | null;
+    /** Platform-specific install command from tool JSON metadata */
+    installCommand: string | null;
+    /** Documentation/website URL */
+    installUrl: string | null;
+}
+export interface ToolStatusResult {
+    git: ToolStatusEntry;
+    gh: ToolStatusEntry;
+}
+export declare function checkToolStatus(): Promise<ToolStatusResult>;
+//# sourceMappingURL=check-tool-status.d.ts.map

package/dist/src/presentation/web/app/actions/check-tool-status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"check-tool-status.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/check-tool-status.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,gEAAgE;IAChE,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,gCAAgC;IAChC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,eAAe,CAAC;IACrB,EAAE,EAAE,eAAe,CAAC;CACrB;AAwBD,wBAAsB,eAAe,IAAI,OAAO,CAAC,gBAAgB,CAAC,CA8BjE"}

package/dist/src/presentation/web/app/actions/check-tool-status.js

@@ -0,0 +1,53 @@
+'use server';
+import { execFile } from 'node:child_process';
+import { IS_WINDOWS } from '../../../../../packages/core/src/infrastructure/platform.js';
+import { resolve } from '../../lib/server-container.js';
+function getVersion(command, args) {
+    return new Promise((resolve) => {
+        try {
+            const opts = IS_WINDOWS ? { timeout: 5000, windowsHide: true } : { timeout: 5000 };
+            execFile(command, args, opts, (error, stdout) => {
+                if (error) {
+                    resolve({ installed: false, version: null });
+                    return;
+                }
+                // Extract version number from output like "git version 2.43.0" or "gh version 2.40.1"
+                const match = stdout.match(/(\d+\.\d+(?:\.\d+)?)/);
+                resolve({ installed: true, version: match?.[1] ?? null });
+            });
+        }
+        catch {
+            resolve({ installed: false, version: null });
+        }
+    });
+}
+export async function checkToolStatus() {
+    // Run version checks and tool metadata lookup in parallel
+    const [gitVersion, ghVersion, tools] = await Promise.all([
+        getVersion('git', ['--version']),
+        getVersion('gh', ['--version']),
+        (async () => {
+            try {
+                const useCase = resolve('ListToolsUseCase');
+                return await useCase.execute();
+            }
+            catch {
+                return [];
+            }
+        })(),
+    ]);
+    const gitTool = tools.find((t) => t.id === 'git');
+    const ghTool = tools.find((t) => t.id === 'gh');
+    return {
+        git: {
+            ...gitVersion,
+            installCommand: gitTool?.installCommand ?? null,
+            installUrl: gitTool?.website ?? 'https://git-scm.com',
+        },
+        gh: {
+            ...ghVersion,
+            installCommand: ghTool?.installCommand ?? null,
+            installUrl: ghTool?.website ?? 'https://cli.github.com',
+        },
+    };
+}

package/dist/src/presentation/web/app/build-graph-nodes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"build-graph-nodes.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/app/build-graph-nodes.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAS1F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAU1C,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,GAAG,EAAE,QAAQ,GAAG,IAAI,CAAC;CACtB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,sBAAsB;IACrC,uEAAuE;IACvE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,6EAA6E;IAC7E,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qEAAqE;IACrE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,0FAA0F;IAC1F,WAAW,CAAC,EAAE,GAAG,CACf,MAAM,EACN;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,CACzF,CAAC;IACF,0DAA0D;IAC1D,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,GAAG,OAAO,GAAG,YAAY,CAAC,CAAC;CACjE;AAED,wBAAgB,eAAe,CAC7B,YAAY,EAAE,UAAU,EAAE,EAC1B,gBAAgB,EAAE,cAAc,EAAE,EAClC,OAAO,CAAC,EAAE,sBAAsB,GAC/B;IAAE,KAAK,EAAE,cAAc,EAAE,CAAC;IAAC,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,CAoG5C"}
+{"version":3,"file":"build-graph-nodes.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/app/build-graph-nodes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAS1F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAG1C,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,GAAG,EAAE,QAAQ,GAAG,IAAI,CAAC;CACtB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,sBAAsB;IACrC,uEAAuE;IACvE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,6EAA6E;IAC7E,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qEAAqE;IACrE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,0FAA0F;IAC1F,WAAW,CAAC,EAAE,GAAG,CACf,MAAM,EACN;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,CACzF,CAAC;IACF,0DAA0D;IAC1D,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,GAAG,OAAO,GAAG,YAAY,CAAC,CAAC;CACjE;AAED,wBAAgB,eAAe,CAC7B,YAAY,EAAE,UAAU,EAAE,EAC1B,gBAAgB,EAAE,cAAc,EAAE,EAClC,OAAO,CAAC,EAAE,sBAAsB,GAC/B;IAAE,KAAK,EAAE,cAAc,EAAE,CAAC;IAAC,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,CAoG5C"}

package/dist/src/presentation/web/app/build-graph-nodes.js

@@ -1,15 +1,7 @@
-import { createHash } from 'node:crypto';
-import path from 'node:path';
 import { AgentRunStatus } from '../../../../packages/core/src/domain/generated/output.js';
 import { deriveNodeState, deriveProgress, deriveLifecycle, } from '../components/common/feature-node/derive-feature-state.js';
 import { isProcessAlive } from '../../../../packages/core/src/infrastructure/services/process/is-process-alive.js';
-import { getShepHomeDir } from '../../../../packages/core/src/infrastructure/services/filesystem/shep-directory.service.js';
-/** Compute the worktree path for a feature, matching WorktreeService.getWorktreePath() */
-function computeWorktreePath(repoPath, branch) {
-    const repoHash = createHash('sha256').update(repoPath).digest('hex').slice(0, 16);
-    const slug = branch.replace(/\//g, '-');
-    return path.join(getShepHomeDir(), 'repos', repoHash, 'wt', slug).replace(/\\/g, '/');
-}
+import { computeWorktreePath } from '../../../../packages/core/src/infrastructure/services/ide-launchers/compute-worktree-path.js';
 export function buildGraphNodes(repositories, featuresWithRuns, options) {
     // Normalize path separators so Windows backslash paths match forward-slash paths
     const normalizePath = (p) => p.replace(/\\/g, '/');

package/dist/src/presentation/web/components/common/feature-node/feature-node-state-config.d.ts

@@ -6,6 +6,23 @@ export type FeatureNodeState = 'creating' | 'running' | 'action-required' | 'don
 export type FeatureLifecyclePhase = 'pending' | 'requirements' | 'research' | 'implementation' | 'review' | 'deploy' | 'maintain';
 /** Human-readable display labels for lifecycle phases. */
 export declare const lifecycleDisplayLabels: Record<FeatureLifecyclePhase, string>;
+/** Left border color for each lifecycle phase. */
+export declare const lifecycleBorderColors: Record<FeatureLifecyclePhase, string>;
+/** Accent bar background color for each lifecycle phase. */
+export declare const lifecycleAccentColors: Record<FeatureLifecyclePhase, string>;
+/** Phase badge: short letter, color classes, and user-friendly tooltip. */
+export declare const lifecyclePhaseBadge: Record<FeatureLifecyclePhase, {
+    letter: string;
+    bg: string;
+    text: string;
+    dot: string;
+    tooltip: string;
+    description: string;
+}>;
+/** State-based left border overrides (takes precedence over lifecycle). */
+export declare const stateBorderColors: Partial<Record<FeatureNodeState, string>>;
+/** State-based accent bar overrides (takes precedence over lifecycle). */
+export declare const stateAccentColors: Partial<Record<FeatureNodeState, string>>;
 /** Present-participle verbs for the running badge, keyed by lifecycle phase. */
 export declare const lifecycleRunningVerbs: Record<FeatureLifecyclePhase, string>;
 export interface FeatureNodeData {

package/dist/src/presentation/web/components/common/feature-node/feature-node-state-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-node-state-config.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node-state-config.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"feature-node-state-config.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node-state-config.ts"],"names":[],"mappings":"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"}

package/dist/src/presentation/web/components/common/feature-node/feature-node-state-config.js

@@ -9,6 +9,97 @@ export const lifecycleDisplayLabels = {
     deploy: 'DEPLOY & QA',
     maintain: 'COMPLETED',
 };
+/** Left border color for each lifecycle phase. */
+export const lifecycleBorderColors = {
+    pending: 'border-l-slate-400',
+    requirements: 'border-l-violet-500',
+    research: 'border-l-cyan-500',
+    implementation: 'border-l-blue-500',
+    review: 'border-l-amber-500',
+    deploy: 'border-l-emerald-500',
+    maintain: 'border-l-gray-400',
+};
+/** Accent bar background color for each lifecycle phase. */
+export const lifecycleAccentColors = {
+    pending: 'bg-slate-400',
+    requirements: 'bg-violet-500',
+    research: 'bg-cyan-500',
+    implementation: 'bg-blue-500',
+    review: 'bg-amber-500',
+    deploy: 'bg-emerald-500',
+    maintain: 'bg-gray-400',
+};
+/** Phase badge: short letter, color classes, and user-friendly tooltip. */
+export const lifecyclePhaseBadge = {
+    pending: {
+        letter: 'P',
+        bg: 'bg-stone-100 dark:bg-stone-800',
+        text: 'text-stone-500 dark:text-stone-400',
+        dot: 'bg-stone-400',
+        tooltip: 'Pending',
+        description: 'Waiting to start — the feature is queued and ready to go.',
+    },
+    requirements: {
+        letter: 'R',
+        bg: 'bg-fuchsia-100 dark:bg-fuchsia-900/40',
+        text: 'text-fuchsia-600 dark:text-fuchsia-300',
+        dot: 'bg-fuchsia-500',
+        tooltip: 'Requirements',
+        description: 'Gathering what to build — the AI is writing a product requirements document (PRD) based on your request.',
+    },
+    research: {
+        letter: 'D',
+        bg: 'bg-teal-100 dark:bg-teal-900/40',
+        text: 'text-teal-600 dark:text-teal-300',
+        dot: 'bg-teal-500',
+        tooltip: 'Research',
+        description: 'Exploring your codebase — the AI is analyzing existing code, patterns, and dependencies to plan the best approach.',
+    },
+    implementation: {
+        letter: 'I',
+        bg: 'bg-indigo-100 dark:bg-indigo-900/40',
+        text: 'text-indigo-600 dark:text-indigo-300',
+        dot: 'bg-indigo-500',
+        tooltip: 'Implementation',
+        description: 'Writing code — the AI is implementing the feature, writing tests, and making sure everything compiles.',
+    },
+    review: {
+        letter: 'M',
+        bg: 'bg-orange-100 dark:bg-orange-900/40',
+        text: 'text-orange-600 dark:text-orange-300',
+        dot: 'bg-orange-500',
+        tooltip: 'Merge Review',
+        description: 'Ready to merge — the code is complete. Review the changes and approve to merge into your repository.',
+    },
+    deploy: {
+        letter: 'Q',
+        bg: 'bg-lime-100 dark:bg-lime-900/40',
+        text: 'text-lime-600 dark:text-lime-300',
+        dot: 'bg-lime-500',
+        tooltip: 'Deploy & QA',
+        description: 'Deploying and testing — the feature is being deployed to a preview environment for quality checks.',
+    },
+    maintain: {
+        letter: '✓',
+        bg: 'bg-emerald-100 dark:bg-emerald-900/40',
+        text: 'text-emerald-500 dark:text-emerald-400',
+        dot: 'bg-emerald-500',
+        tooltip: 'Completed',
+        description: 'All done — the feature has been merged and delivered successfully.',
+    },
+};
+/** State-based left border overrides (takes precedence over lifecycle). */
+export const stateBorderColors = {
+    blocked: 'border-l-gray-400',
+    error: 'border-l-red-500',
+    deleting: 'border-l-gray-300',
+};
+/** State-based accent bar overrides (takes precedence over lifecycle). */
+export const stateAccentColors = {
+    blocked: 'bg-gray-400',
+    error: 'bg-red-500',
+    deleting: 'bg-gray-300',
+};
 /** Present-participle verbs for the running badge, keyed by lifecycle phase. */
 export const lifecycleRunningVerbs = {
     pending: 'Waiting to start',

package/dist/src/presentation/web/components/common/feature-node/feature-node.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-node.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AA6DnE,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,eAAe,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,2CAqWA"}
+{"version":3,"file":"feature-node.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AA4CnE,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,eAAe,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,2CA6WA"}

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

@@ -2,42 +2,30 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Handle, Position } from '@xyflow/react';
-import { Plus, FileText, Wrench, GitMerge, Trash2, Zap, Loader2, Globe, RotateCcw, Play, } from 'lucide-react';
+import { Plus, Trash2, Zap, Loader2, Globe, RotateCcw, Play, Eye, } from 'lucide-react';
 import { cn } from '../../../lib/utils.js';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../ui/tooltip.js';
 import { DeleteFeatureDialog } from '../../common/delete-feature-dialog/index.js';
-import { featureNodeStateConfig, lifecycleDisplayLabels, lifecycleRunningVerbs, } from './feature-node-state-config.js';
-import { getAgentTypeIcon, agentTypeLabels } from './agent-type-icons.js';
-import { getModelMeta } from '../../../lib/model-metadata.js';
+import { featureNodeStateConfig, lifecycleRunningVerbs, lifecyclePhaseBadge, } from './feature-node-state-config.js';
+import { getAgentTypeIcon } from './agent-type-icons.js';
 import { DeploymentState } from '../../../../../../packages/core/src/domain/generated/output.js';
-import { FeatureSessionsDropdown } from './feature-sessions-dropdown.js';
 function AgentIcon({ agentType, className }) {
     const IconComponent = getAgentTypeIcon(agentType);
     return _jsx(IconComponent, { className: className });
 }
 function getBadgeIcon(data) {
     const config = featureNodeStateConfig[data.state];
-    if (data.state === 'action-required') {
-        if (data.lifecycle === 'requirements')
-            return FileText;
-        if (data.lifecycle === 'implementation')
-            return Wrench;
-        if (data.lifecycle === 'review')
-            return GitMerge;
-    }
     return config.icon;
 }
-/** Returns override badge classes for action-required based on lifecycle phase. */
-function getActionRequiredBadgeClasses(data) {
-    if (data.state !== 'action-required')
-        return null;
-    if (data.lifecycle === 'implementation') {
-        return { badgeClass: 'text-indigo-700', badgeBgClass: 'bg-indigo-50' };
-    }
-    if (data.lifecycle === 'review') {
-        return { badgeClass: 'text-emerald-700', badgeBgClass: 'bg-emerald-50' };
-    }
-    return null; // requirements stays amber (default)
+/** Short, friendly label for each action-required gate. */
+function getActionRequiredLabel(data) {
+    if (data.lifecycle === 'requirements')
+        return 'Review Requirements';
+    if (data.lifecycle === 'implementation')
+        return 'Review Technical Plan';
+    if (data.lifecycle === 'review')
+        return 'Review Changes';
+    return 'Review';
 }
 function getBadgeText(data) {
     const config = featureNodeStateConfig[data.state];
@@ -53,13 +41,7 @@ function getBadgeText(data) {
         case 'pending':
             return 'Pending';
         case 'action-required':
-            if (data.lifecycle === 'requirements')
-                return 'Review Product Requirements';
-            if (data.lifecycle === 'implementation')
-                return 'Review Technical Planning';
-            if (data.lifecycle === 'review')
-                return 'Review Merge Request';
-            return config.label;
+            return getActionRequiredLabel(data);
         case 'error':
             return data.errorMessage ?? 'Something went wrong';
         default:
@@ -76,40 +58,48 @@ export function FeatureNode({ data, selected, }) {
                                             }, className: "bg-card text-muted-foreground hover:border-destructive hover:text-destructive flex h-7 w-7 cursor-pointer items-center justify-center rounded-full border shadow-sm transition-colors", children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Delete feature" })] }) }) }), _jsx(DeleteFeatureDialog, { open: confirmOpen, onOpenChange: setConfirmOpen, onConfirm: (cleanup, cascadeDelete, closePr) => {
                             setConfirmOpen(false);
                             data.onDelete?.(data.featureId, cleanup, cascadeDelete, closePr);
-                        }, isDeleting: false, featureName: data.name ?? 'this feature', featureId: data.featureId, hasChildren: data.hasChildren, hasOpenPr: !!data.pr && data.pr.status === 'Open' })] })) : null, _jsxs("div", { "data-testid": "feature-node-card", "aria-busy": data.state === 'creating' || data.state === 'deleting' ? 'true' : undefined, className: cn('bg-card flex min-h-35 w-72 cursor-pointer flex-col rounded-lg border p-3 shadow-sm', selected && 'ring-primary ring-2', data.state === 'deleting' && 'opacity-60'), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { "data-testid": "feature-node-lifecycle-label", className: cn('text-[10px] font-semibold tracking-wider'), children: data.state === 'blocked'
-                                    ? 'BLOCKED'
-                                    : data.state === 'pending'
-                                        ? 'PENDING'
-                                        : lifecycleDisplayLabels[data.lifecycle] }), _jsxs("div", { className: "flex items-center gap-0.5", children: [data.deployment ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": data.deployment.status === DeploymentState.Booting
-                                                            ? 'Deploying'
-                                                            : 'Open dev server', "data-testid": "feature-node-deployment-indicator", onClick: (e) => {
+                        }, isDeleting: false, featureName: data.name ?? 'this feature', featureId: data.featureId, hasChildren: data.hasChildren, hasOpenPr: !!data.pr && data.pr.status === 'Open' })] })) : null, _jsxs("div", { "data-testid": "feature-node-card", "aria-busy": data.state === 'creating' || data.state === 'deleting' ? 'true' : undefined, className: cn('bg-card flex min-h-35 w-97 cursor-pointer flex-col rounded-lg border p-3 shadow-sm dark:bg-neutral-800/80', data.state === 'action-required' && 'border-amber-300/60 dark:border-amber-700/40', selected && 'ring-primary ring-2', data.state === 'deleting' && 'opacity-60'), children: [data.state !== 'creating' ? (_jsx("div", { className: "absolute top-3 right-4", children: _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("span", { "data-testid": "feature-node-phase-badge", className: "flex items-center gap-1.5", children: [_jsx("span", { className: "text-muted-foreground text-[10px]", children: lifecyclePhaseBadge[data.lifecycle].tooltip }), _jsx("span", { className: cn('h-1.5 w-1.5 -translate-y-px rounded-full', lifecyclePhaseBadge[data.lifecycle].dot) })] }) }), _jsxs(TooltipContent, { side: "bottom", className: "max-w-56 bg-white text-neutral-900 shadow-lg dark:bg-neutral-100 dark:text-neutral-900", children: [_jsx("p", { className: "font-semibold", children: lifecyclePhaseBadge[data.lifecycle].tooltip }), _jsx("p", { className: "mt-1 text-xs leading-relaxed text-neutral-500", children: lifecyclePhaseBadge[data.lifecycle].description })] })] }) }) })) : null, _jsxs("div", { className: "flex items-center gap-1.5", children: [data.agentType ? (_jsx(AgentIcon, { agentType: data.agentType, className: "h-4 w-4 shrink-0" })) : null, _jsx("h3", { className: "min-w-0 truncate text-sm font-bold", children: data.name })] }), data.description ? (_jsx("p", { "data-testid": "feature-node-description", className: "text-muted-foreground mt-1 line-clamp-2 text-xs", children: data.description })) : null, _jsxs("div", { className: "mt-auto pt-2", children: [config.showProgressBar ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "text-muted-foreground flex items-center justify-end text-[10px]", children: _jsxs("span", { children: [data.progress, "%"] }) }), _jsx("div", { "data-testid": "feature-node-progress-bar", className: "bg-muted mt-1.5 h-1 w-full overflow-hidden rounded-full", children: _jsx("div", { className: cn('h-full rounded-full transition-all', config.progressClass), style: { width: `${data.progress}%` } }) })] })) : null, !config.showProgressBar &&
+                                ![
+                                    'deleting',
+                                    'creating',
+                                    'running',
+                                    'done',
+                                    'action-required',
+                                    'pending',
+                                    'blocked',
+                                ].includes(data.state) ? (_jsxs("div", { "data-testid": "feature-node-badge", className: "relative flex min-w-0 items-center gap-1.5 text-xs", children: [(() => {
+                                        const BadgeIcon = getBadgeIcon(data);
+                                        return _jsx(BadgeIcon, { className: cn('h-3.5 w-3.5 shrink-0', config.badgeClass) });
+                                    })(), _jsx("span", { className: cn('translate-y-px truncate text-[11px] font-medium', config.badgeClass), children: getBadgeText(data) })] })) : null, _jsxs("div", { className: "mt-1.5 flex min-h-[26px] items-center justify-between gap-2", children: [_jsxs("div", { className: "flex items-center gap-1.5", style: { transform: 'translateY(1px)' }, children: [data.featureId ? (_jsxs("div", { className: "flex items-baseline gap-1", children: [_jsx("span", { className: "text-muted-foreground/50 text-[10px]", children: "ID" }), _jsx("button", { type: "button", "data-testid": "feature-node-id", className: "nodrag text-muted-foreground/60 hover:text-muted-foreground cursor-pointer font-mono text-[10px] transition-colors", onClick: (e) => {
                                                             e.stopPropagation();
-                                                            if (data.deployment?.status === DeploymentState.Ready &&
-                                                                data.deployment.url) {
-                                                                window.open(data.deployment.url, '_blank', 'noopener,noreferrer');
-                                                            }
-                                                        }, className: cn('nodrag -mt-1 p-1', data.deployment.status === DeploymentState.Ready && data.deployment.url
-                                                            ? 'cursor-pointer opacity-80 transition-opacity hover:opacity-100'
-                                                            : 'cursor-default'), children: data.deployment.status === DeploymentState.Booting ? (_jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin text-blue-500" })) : (_jsx(Globe, { className: "h-3.5 w-3.5 text-green-600" })) }) }), _jsx(TooltipContent, { side: "bottom", children: data.deployment.status === DeploymentState.Booting
-                                                        ? 'Deploying...'
-                                                        : (data.deployment.url ?? 'Live') })] }) })) : null, data.fastMode ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { "data-testid": "feature-node-fast-mode-badge", className: "-mt-1 p-1", children: _jsx(Zap, { className: "h-3.5 w-3.5 text-amber-500" }) }) }), _jsx(TooltipContent, { side: "bottom", children: "Fast Mode" })] }) })) : null, data.agentType ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": agentTypeLabels[data.agentType] ?? data.agentType, "data-testid": "feature-node-agent-badge", onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            data.onSettings?.();
-                                                        }, className: cn('nodrag -mt-1 -mr-1 p-1', data.onSettings
-                                                            ? 'cursor-pointer opacity-80 transition-opacity hover:opacity-100'
-                                                            : 'cursor-default'), children: _jsx(AgentIcon, { agentType: data.agentType, className: "h-3.5 w-3.5" }) }) }), _jsxs(TooltipContent, { side: "bottom", children: [_jsx("span", { className: "font-medium", children: agentTypeLabels[data.agentType] ?? data.agentType }), data.modelId ? (_jsxs("span", { className: "ml-1 opacity-70", children: ["\u00B7 ", getModelMeta(data.modelId).displayName || data.modelId] })) : null] })] }) })) : null] })] }), _jsx("h3", { className: "mt-1 truncate text-sm font-bold", children: data.name }), data.description ? (_jsx("p", { "data-testid": "feature-node-description", className: "text-muted-foreground mt-0.5 truncate text-xs", children: data.description })) : null, _jsx("div", { className: "mt-auto pt-2", children: data.state === 'deleting' ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "mt-1.5 flex items-center gap-1.5 text-xs", children: [_jsx(Trash2, { className: "h-3.5 w-3.5 shrink-0 text-gray-400" }), _jsx("span", { className: "text-muted-foreground", children: "Deleting\u2026" })] }), _jsx("div", { "data-testid": "feature-node-progress-bar", className: "bg-muted mt-1.5 h-1 w-full overflow-hidden rounded-full", children: _jsx("div", { className: "motion-safe:animate-indeterminate-progress bg-foreground/30 h-full w-1/3 rounded-full" }) })] })) : data.state === 'creating' ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "mt-1.5 flex items-center gap-1.5 text-xs", children: [_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0 animate-spin" }), _jsx("span", { className: "text-muted-foreground", children: getBadgeText(data) })] }), _jsx("div", { "data-testid": "feature-node-progress-bar", className: "bg-muted mt-1.5 h-1 w-full overflow-hidden rounded-full", children: _jsx("div", { className: "motion-safe:animate-indeterminate-progress bg-foreground/30 h-full w-1/3 rounded-full" }) })] })) : data.state === 'running' ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "mt-1.5 flex items-center gap-1.5 text-xs", children: [_jsx(AgentIcon, { agentType: data.agentType, className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "text-muted-foreground", children: getBadgeText(data) })] }), _jsx("div", { "data-testid": "feature-node-progress-bar", className: "bg-muted mt-1.5 h-1 w-full overflow-hidden rounded-full", children: _jsx("div", { className: "animate-indeterminate-progress bg-foreground/30 h-full w-1/3 rounded-full" }) })] })) : config.showProgressBar ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "text-muted-foreground flex items-center justify-end text-[10px]", children: _jsxs("span", { children: [data.progress, "%"] }) }), _jsx("div", { "data-testid": "feature-node-progress-bar", className: "bg-muted mt-1.5 h-1 w-full overflow-hidden rounded-full", children: _jsx("div", { className: cn('h-full rounded-full transition-all', config.progressClass), style: { width: `${data.progress}%` } }) })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "text-muted-foreground flex items-center justify-between text-[10px]", children: [_jsx("span", { children: data.featureId }), (data.worktreePath ?? data.repositoryPath) ? (_jsx(FeatureSessionsDropdown, { repositoryPath: data.worktreePath ?? data.repositoryPath })) : null] }), _jsxs("div", { className: "mt-1.5 flex items-center gap-1.5", children: [_jsxs("div", { "data-testid": "feature-node-badge", className: (() => {
-                                                const override = getActionRequiredBadgeClasses(data);
-                                                return cn('flex min-w-0 flex-1 items-center justify-center gap-1.5 rounded-full px-2.5 py-1 text-[11px] font-medium', override?.badgeBgClass ?? config.badgeBgClass, override?.badgeClass ?? config.badgeClass);
-                                            })(), children: [(() => {
-                                                    const BadgeIcon = getBadgeIcon(data);
-                                                    return _jsx(BadgeIcon, { className: "h-3.5 w-3.5 shrink-0" });
-                                                })(), _jsx("span", { className: "truncate", children: getBadgeText(data) })] }), data.state === 'error' && data.onRetry ? (_jsxs("button", { type: "button", "aria-label": "Retry feature", "data-testid": "feature-node-retry-button", onClick: (e) => {
-                                                e.stopPropagation();
-                                                data.onRetry(data.featureId);
-                                            }, className: "nodrag flex shrink-0 cursor-pointer items-center gap-1 rounded-full bg-red-100 px-2.5 py-1 text-[11px] font-medium text-red-700 transition-colors hover:bg-red-200", children: [_jsx(RotateCcw, { className: "h-3 w-3" }), "Retry"] })) : null, data.state === 'pending' && data.onStart ? (_jsxs("button", { type: "button", "aria-label": "Start feature", "data-testid": "feature-node-start-button", onClick: (e) => {
-                                                e.stopPropagation();
-                                                data.onStart(data.featureId);
-                                            }, className: "nodrag flex shrink-0 cursor-pointer items-center gap-1 rounded-full bg-slate-100 px-2.5 py-1 text-[11px] font-medium text-slate-700 transition-colors hover:bg-slate-200", children: [_jsx(Play, { className: "h-3 w-3" }), "Start"] })) : null] })] })) })] }), data.onAction && data.state !== 'deleting' ? (_jsx(Handle, { type: "source", position: Position.Right, className: "h-0! w-0! border-0! bg-transparent!", style: { top: 70 }, children: _jsx("button", { type: "button", "aria-label": "Add", "data-testid": "feature-node-action-button", onClick: (e) => {
+                                                            navigator.clipboard.writeText(data.featureId);
+                                                        }, title: `Click to copy: ${data.featureId}`, children: data.featureId.slice(0, 6) })] })) : null, data.deployment ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": data.deployment.status === DeploymentState.Booting
+                                                                    ? 'Deploying'
+                                                                    : 'Open dev server', "data-testid": "feature-node-deployment-indicator", onClick: (e) => {
+                                                                    e.stopPropagation();
+                                                                    if (data.deployment?.status === DeploymentState.Ready &&
+                                                                        data.deployment.url) {
+                                                                        window.open(data.deployment.url, '_blank', 'noopener,noreferrer');
+                                                                    }
+                                                                }, className: cn('nodrag', data.deployment.status === DeploymentState.Ready && data.deployment.url
+                                                                    ? 'cursor-pointer opacity-80 transition-opacity hover:opacity-100'
+                                                                    : 'cursor-default'), children: data.deployment.status === DeploymentState.Booting ? (_jsx(Loader2, { className: "h-3 w-3 animate-spin text-blue-500" })) : (_jsx(Globe, { className: "h-3 w-3 text-green-600" })) }) }), _jsx(TooltipContent, { side: "top", children: data.deployment.status === DeploymentState.Booting
+                                                                ? 'Deploying...'
+                                                                : (data.deployment.url ?? 'Live') })] }) })) : null, data.fastMode ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { "data-testid": "feature-node-fast-mode-badge", children: _jsx(Zap, { className: "h-3 w-3 text-amber-500" }) }) }), _jsx(TooltipContent, { side: "top", children: "Fast Mode" })] }) })) : null] }), data.state === 'deleting' ? (_jsxs("div", { className: "flex items-center gap-1.5 text-xs", children: [_jsx(Loader2, { className: "h-3.5 w-3.5 shrink-0 animate-spin text-gray-400" }), _jsx("span", { className: "text-muted-foreground", children: "Deleting\u2026" })] })) : data.state === 'creating' ? (_jsxs("div", { className: "flex items-center gap-1.5 text-xs", children: [_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0 animate-spin" }), _jsx("span", { className: "text-muted-foreground", children: getBadgeText(data) })] })) : data.state === 'running' ? (_jsxs("div", { className: "flex items-center gap-1.5 text-xs", children: [_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0 animate-spin" }), _jsx("span", { className: "text-muted-foreground", children: getBadgeText(data) })] })) : data.state === 'action-required' ? (_jsxs("button", { type: "button", "aria-label": getActionRequiredLabel(data), "data-testid": "feature-node-approve-button", 
+                                        // eslint-disable-next-line @typescript-eslint/no-empty-function -- click bubbles to card's onNodeClick
+                                        onClick: () => { }, className: "nodrag relative inline-flex shrink-0 cursor-pointer items-center gap-1.5 overflow-hidden rounded-md bg-gradient-to-b from-neutral-800 via-neutral-900 to-neutral-950 px-3 py-1.5 text-[11px] font-semibold transition-all hover:from-neutral-700 hover:via-neutral-800 hover:to-neutral-900 active:from-neutral-900 active:to-black", children: [_jsx("span", { className: "animate-shimmer pointer-events-none absolute inset-0 bg-gradient-to-r from-transparent via-white/15 to-transparent bg-[length:200%_100%]" }), _jsx(Eye, { className: "relative h-3 w-3 text-amber-400" }), _jsx("span", { className: "animate-shimmer relative bg-gradient-to-r from-amber-400 via-yellow-200 to-amber-400 bg-[length:200%_100%] bg-clip-text text-transparent", children: getActionRequiredLabel(data) })] })) : data.state === 'error' && data.onRetry ? (_jsxs("button", { type: "button", "aria-label": "Retry", "data-testid": "feature-node-retry-button", onClick: (e) => {
+                                            e.stopPropagation();
+                                            data.onRetry(data.featureId);
+                                        }, className: "nodrag inline-flex shrink-0 cursor-pointer items-center gap-1 rounded-md bg-neutral-800 px-2.5 py-1 text-[11px] font-medium text-white shadow-sm transition-all hover:bg-neutral-700 active:bg-neutral-900 dark:bg-neutral-200 dark:text-neutral-900 dark:hover:bg-neutral-300", children: [_jsx(RotateCcw, { className: "h-3 w-3" }), "Retry"] })) : data.state === 'blocked' ? (_jsxs("div", { className: "flex items-center gap-1.5 text-xs", "data-testid": "feature-node-badge", children: [(() => {
+                                                const BadgeIcon = getBadgeIcon(data);
+                                                return _jsx(BadgeIcon, { className: cn('h-3.5 w-3.5 shrink-0', config.badgeClass) });
+                                            })(), _jsx("span", { className: cn('truncate text-[11px] font-medium', config.badgeClass), children: getBadgeText(data) })] })) : data.state === 'done' ? (_jsxs("div", { className: "flex items-center gap-1.5 text-xs", "data-testid": "feature-node-badge", children: [(() => {
+                                                const BadgeIcon = getBadgeIcon(data);
+                                                return _jsx(BadgeIcon, { className: cn('h-3.5 w-3.5 shrink-0', config.badgeClass) });
+                                            })(), _jsx("span", { className: cn('text-[11px] font-medium', config.badgeClass), children: getBadgeText(data) })] })) : data.state === 'pending' && data.onStart ? (_jsxs("button", { type: "button", "aria-label": "Start", "data-testid": "feature-node-start-button", onClick: (e) => {
+                                            e.stopPropagation();
+                                            data.onStart(data.featureId);
+                                        }, className: "nodrag inline-flex shrink-0 cursor-pointer items-center gap-1 rounded-md bg-neutral-800 px-2.5 py-1 text-[11px] font-medium text-white shadow-sm transition-all hover:bg-neutral-700 active:bg-neutral-900 dark:bg-neutral-200 dark:text-neutral-900 dark:hover:bg-neutral-300", children: [_jsx(Play, { className: "h-3 w-3" }), "Start"] })) : null] })] })] }), data.onAction && data.state !== 'deleting' ? (_jsx(Handle, { type: "source", position: Position.Right, className: "h-0! w-0! border-0! bg-transparent!", style: { top: 70 }, children: _jsx("button", { type: "button", "aria-label": "Add", "data-testid": "feature-node-action-button", onClick: (e) => {
                         e.stopPropagation();
                         data.onAction?.();
                     }, className: "nodrag absolute top-1/2 left-1/2 flex h-6 w-6 -translate-x-1/2 -translate-y-1/2 cursor-pointer items-center justify-center rounded-full bg-blue-500 text-white opacity-0 shadow-md transition-opacity group-hover:opacity-100 hover:bg-blue-600", children: _jsx(Plus, { className: "h-3.5 w-3.5" }) }) })) : data.showHandles ? (_jsx(Handle, { type: "source", position: Position.Right, isConnectable: false, className: "opacity-0!", style: { top: 70 } })) : null] }));

package/dist/src/presentation/web/components/common/feature-node/feature-node.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-node.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMvD,OAAO,KAAK,EACV,eAAe,EAIhB,MAAM,6BAA6B,CAAC;AAiCrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,eAAe,CAc/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AA0HF,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC;AAYF,eAAO,MAAM,aAAa,EAAE,KAqB3B,CAAC;AA2EF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAW7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAUvC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAatB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAc1B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAY/B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAa7B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAYlC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,KAe5C,CAAC;AA4EF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC"}
+{"version":3,"file":"feature-node.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMvD,OAAO,KAAK,EACV,eAAe,EAIhB,MAAM,6BAA6B,CAAC;AAoCrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,eAAe,CAqB/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAqLF,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC;AAYF,eAAO,MAAM,aAAa,EAAE,KAqB3B,CAAC;AA2EF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAW7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAUvC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAatB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAc1B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAY/B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAa7B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAYlC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,KAe5C,CAAC;AA4EF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC"}