@shepai/cli 1.169.1 → 1.170.0-pr513.cff27cb

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

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useCallback, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PaperclipIcon, ChevronsUpDown, CheckIcon, Zap, Clock, FolderPlus, Loader2, GitFork, FileText, RefreshCw, } from 'lucide-react';
+import { PaperclipIcon, ChevronsUpDown, CheckIcon, Clock, FolderPlus, Loader2, GitFork, FileText, Puzzle, RefreshCw, } from 'lucide-react';
 import { cn } from '../../../lib/utils.js';
 import { useSoundAction } from '../../../hooks/use-sound-action.js';
 import { BaseDrawer } from '../../common/base-drawer/index.js';
@@ -23,7 +23,9 @@ import { Separator } from '../../ui/separator.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 { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { addRepository } from '../../../app/actions/add-repository.js';
+import { ModeSelector } from './mode-selector.js';
 import { pickFiles } from './pick-files.js';
 const MAX_FILE_SIZE = 10 * 1024 * 1024; // 10 MB
 const ALLOWED_EXTENSIONS = new Set([
@@ -112,7 +114,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
     const defaultCiWatch = workflowDefaults?.ciWatchEnabled !== false;
     const defaultEnableEvidence = workflowDefaults?.enableEvidence ?? false;
     const defaultCommitEvidence = workflowDefaults?.commitEvidence ?? false;
-    const defaultFast = workflowDefaults?.fast !== false;
+    const defaultMode = workflowDefaults?.defaultMode ?? FeatureMode.Fast;
     const [description, setDescription] = useState(initialDescription ?? '');
     // Sync description when initialDescription prop changes (e.g. from session context)
     useEffect(() => {
@@ -128,11 +130,12 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
     const [enableEvidence, setEnableEvidence] = useState(defaultEnableEvidence);
     const [commitEvidence, setCommitEvidence] = useState(defaultCommitEvidence);
     const [parentId, setParentId] = useState(undefined);
-    const [fast, setFast] = useState(defaultFast);
+    const [mode, setMode] = useState(defaultMode);
     const [pending, setPending] = useState(false);
     const [forkAndPr, setForkAndPr] = useState(false);
     const [commitSpecs, setCommitSpecs] = useState(true);
     const [rebaseBeforeBranch, setRebaseBeforeBranch] = useState(true);
+    const [injectSkills, setInjectSkills] = useState(workflowDefaults?.injectSkills ?? false);
     const [overrideAgent, setOverrideAgent] = useState(undefined);
     const [overrideModel, setOverrideModel] = useState(undefined);
     const [selectedRepoPath, setSelectedRepoPath] = useState(validRepoPath || undefined);
@@ -153,7 +156,8 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
             setCiWatchEnabled(workflowDefaults.ciWatchEnabled !== false);
             setEnableEvidence(workflowDefaults.enableEvidence);
             setCommitEvidence(workflowDefaults.commitEvidence);
-            setFast(workflowDefaults.fast !== false);
+            setMode(workflowDefaults.defaultMode ?? FeatureMode.Fast);
+            setInjectSkills(workflowDefaults.injectSkills ?? false);
         }
     }, [workflowDefaults]);
     // Sync localRepos when repositories prop changes
@@ -203,7 +207,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         setParentId(undefined);
         setSelectedRepoPath(validRepoPath || undefined);
         setLocalRepos(repositories ?? []);
-        setFast(defaultFast);
+        setMode(defaultMode);
         setPending(false);
         setForkAndPr(false);
         setCommitSpecs(true);
@@ -220,7 +224,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         defaultEnableEvidence,
         defaultCiWatch,
         defaultCommitEvidence,
-        defaultFast,
+        defaultMode,
         validRepoPath,
         repositories,
     ]);
@@ -357,10 +361,11 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
             ciWatchEnabled,
             enableEvidence,
             commitEvidence,
-            fast,
+            mode,
             forkAndPr,
             commitSpecs,
             rebaseBeforeBranch,
+            injectSkills,
             ...(pending ? { pending } : {}),
             ...(overrideAgent ? { agentType: overrideAgent } : {}),
             ...(overrideModel ? { model: overrideModel } : {}),
@@ -380,10 +385,11 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         enableEvidence,
         ciWatchEnabled,
         commitEvidence,
-        fast,
+        mode,
         forkAndPr,
         commitSpecs,
         rebaseBeforeBranch,
+        injectSkills,
         pending,
         overrideAgent,
         overrideModel,
@@ -490,8 +496,10 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
                                         validRepoPath.split('/').pop() })] })) : null, _jsxs("div", { role: "region", "aria-label": t('createDrawer.fileDropZone'), "data-drag-over": isDragOver ? 'true' : 'false', onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, className: cn('flex flex-col gap-1.5 rounded-md border-2 border-transparent p-1 transition-colors', isDragOver && 'border-primary/50 bg-primary/5'), children: [_jsx(Label, { htmlFor: "feature-description", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: t('createDrawer.describeFeature') }), _jsxs("div", { ref: promptContainerRef, onFocus: handlePromptFocus, onBlur: handlePromptBlur, className: cn('border-input flex h-56 flex-col overflow-hidden rounded-md border shadow-xs transition-[color,box-shadow]', isPromptFocused && 'ring-ring/50 border-ring ring-[3px]'), children: [_jsx(Textarea, { id: "feature-description", placeholder: t('createDrawer.featurePlaceholder'), value: description, onChange: (e) => setDescription(e.target.value), onPaste: handlePaste, required: true, disabled: isSubmitting, className: "min-h-0 flex-1 resize-none rounded-none border-0 shadow-none focus-visible:ring-0" }), attachments.length > 0 && (_jsx("div", { className: "flex flex-wrap items-center gap-1.5 px-3 py-2", children: attachments.map((file) => (_jsx(AttachmentChip, { name: file.name, size: file.size, mimeType: file.mimeType, path: file.path, onRemove: () => handleRemoveFile(file.id), disabled: isSubmitting, loading: file.loading, notes: file.notes, onNotesChange: (notes) => handleNotesChange(file.id, notes) }, file.id))) })), uploadError ? (_jsx("p", { className: "text-destructive px-3 pb-2 text-xs", children: uploadError })) : null, _jsxs("div", { className: "border-input flex items-center gap-3 border-t px-3 py-1.5", children: [_jsx(AgentModelPicker, { initialAgentType: overrideAgent ?? currentAgentType ?? 'claude-code', initialModel: overrideModel ?? currentModel ?? 'claude-sonnet-4-6', mode: "override", onAgentModelChange: (agent, model) => {
                                                         setOverrideAgent(agent);
                                                         setOverrideModel(model);
-                                                    }, disabled: isSubmitting, className: "w-55" }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "ml-auto flex cursor-pointer items-center gap-2", children: [_jsx(Switch, { id: "pending-mode", checked: pending, onCheckedChange: setPending, disabled: isSubmitting }), _jsxs(Label, { htmlFor: "pending-mode", className: "flex cursor-pointer items-center gap-1 text-sm font-medium", children: [_jsx(Clock, { className: "h-3.5 w-3.5" }), t('createDrawer.pendingMode')] })] }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.pendingModeDescription') })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-2", children: [_jsx(Switch, { id: "fast-mode", checked: fast, onCheckedChange: setFast, disabled: isSubmitting }), _jsxs(Label, { htmlFor: "fast-mode", className: "flex cursor-pointer items-center gap-1 text-sm font-medium", children: [_jsx(Zap, { className: "h-3.5 w-3.5" }), t('createDrawer.fastModeLabel')] })] }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.fastModeDescription') })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: handleAddFiles, disabled: isSubmitting, "aria-label": t('chat.attachFiles'), className: "text-muted-foreground hover:text-foreground cursor-pointer rounded p-1 transition-colors", children: _jsx(PaperclipIcon, { className: "h-4 w-4" }) }) }), _jsx(TooltipContent, { side: "bottom", children: t('chat.attachFiles') })] })] })] })] }), hasFeatures && initialParentId !== undefined ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "parent-feature", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: t('createDrawer.parentFeature') }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: t('createDrawer.approve') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.approveDescription') })] }), _jsx("div", { className: "flex flex-1 items-center gap-4", children: AUTO_APPROVE_OPTIONS.map((opt) => (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: `approve-${opt.id}`, size: "sm", checked: approvalGates[opt.id] ?? false, onCheckedChange: (v) => setApprovalGates((prev) => ({ ...prev, [opt.id]: v })), disabled: isSubmitting ||
-                                                                        (fast && (opt.id === 'allowPrd' || opt.id === 'allowPlan')) }), _jsx(Label, { htmlFor: `approve-${opt.id}`, className: "cursor-pointer text-xs font-medium", children: opt.label })] }) }), _jsx(TooltipContent, { side: "bottom", children: fast && (opt.id === 'allowPrd' || opt.id === 'allowPlan')
+                                                    }, disabled: isSubmitting, className: "w-55" }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "ml-auto flex cursor-pointer items-center gap-2", children: [_jsx(Switch, { id: "pending-mode", checked: pending, onCheckedChange: setPending, disabled: isSubmitting }), _jsxs(Label, { htmlFor: "pending-mode", className: "flex cursor-pointer items-center gap-1 text-sm font-medium", children: [_jsx(Clock, { className: "h-3.5 w-3.5" }), t('createDrawer.pendingMode')] })] }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.pendingModeDescription') })] }), _jsx(ModeSelector, { value: mode, onChange: setMode, disabled: isSubmitting }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: handleAddFiles, disabled: isSubmitting, "aria-label": t('chat.attachFiles'), className: "text-muted-foreground hover:text-foreground cursor-pointer rounded p-1 transition-colors", children: _jsx(PaperclipIcon, { className: "h-4 w-4" }) }) }), _jsx(TooltipContent, { side: "bottom", children: t('chat.attachFiles') })] })] })] })] }), hasFeatures && initialParentId !== undefined ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "parent-feature", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: t('createDrawer.parentFeature') }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [mode !== FeatureMode.Exploration && (_jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: t('createDrawer.approve') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.approveDescription') })] }), _jsx("div", { className: "flex flex-1 items-center gap-4", children: AUTO_APPROVE_OPTIONS.map((opt) => (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: `approve-${opt.id}`, size: "sm", checked: approvalGates[opt.id] ?? false, onCheckedChange: (v) => setApprovalGates((prev) => ({ ...prev, [opt.id]: v })), disabled: isSubmitting ||
+                                                                        (mode === FeatureMode.Fast &&
+                                                                            (opt.id === 'allowPrd' || opt.id === 'allowPlan')) }), _jsx(Label, { htmlFor: `approve-${opt.id}`, className: "cursor-pointer text-xs font-medium", children: opt.label })] }) }), _jsx(TooltipContent, { side: "bottom", children: mode === FeatureMode.Fast &&
+                                                            (opt.id === 'allowPrd' || opt.id === 'allowPlan')
                                                             ? t('createDrawer.skippedInFastMode')
                                                             : opt.description })] }, opt.id))) }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => {
                                                             const allOn = AUTO_APPROVE_OPTIONS.every((o) => approvalGates[o.id]);
@@ -499,7 +507,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
                                                             for (const o of AUTO_APPROVE_OPTIONS)
                                                                 next[o.id] = !allOn;
                                                             setApprovalGates(next);
-                                                        }, disabled: isSubmitting, className: cn('text-muted-foreground hover:text-foreground cursor-pointer rounded px-1.5 py-0.5 text-[10px] font-semibold tracking-wider uppercase transition-colors', AUTO_APPROVE_OPTIONS.every((o) => approvalGates[o.id]) && 'text-primary'), children: t('createDrawer.all') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.toggleAllApprovalGates') })] })] }), _jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: t('createDrawer.evidence') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.evidenceDescription') })] }), _jsxs("div", { className: "flex flex-1 items-center gap-4", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: "enable-evidence", size: "sm", checked: enableEvidence, onCheckedChange: (v) => {
+                                                        }, disabled: isSubmitting, className: cn('text-muted-foreground hover:text-foreground cursor-pointer rounded px-1.5 py-0.5 text-[10px] font-semibold tracking-wider uppercase transition-colors', AUTO_APPROVE_OPTIONS.every((o) => approvalGates[o.id]) && 'text-primary'), children: t('createDrawer.all') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.toggleAllApprovalGates') })] })] })), _jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: t('createDrawer.evidence') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.evidenceDescription') })] }), _jsxs("div", { className: "flex flex-1 items-center gap-4", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: "enable-evidence", size: "sm", checked: enableEvidence, onCheckedChange: (v) => {
                                                                             setEnableEvidence(v);
                                                                             if (!v)
                                                                                 setCommitEvidence(false);
@@ -507,7 +515,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
                                                                 ? t('createDrawer.requiresPr')
                                                                 : !enableEvidence
                                                                     ? t('createDrawer.requiresEvidence')
-                                                                    : t('createDrawer.addToPrDescription') })] })] })] }), _jsxs("div", { className: "border-input flex items-start gap-4 rounded-md border px-3 py-2.5", children: [_jsx("span", { className: "text-muted-foreground w-16 shrink-0 pt-0.5 text-xs font-semibold tracking-wider", children: t('createDrawer.git') }), _jsxs("div", { className: "flex flex-1 flex-wrap items-center gap-4", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: "push", size: "sm", checked: forkAndPr ? true : push || openPr, onCheckedChange: (v) => {
+                                                                    : t('createDrawer.addToPrDescription') })] })] })] }), _jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: t('createDrawer.skills') }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.skillsDescription') })] }), _jsx("div", { className: "flex flex-1 items-center gap-4", children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: "inject-skills", size: "sm", checked: injectSkills, onCheckedChange: setInjectSkills, disabled: isSubmitting }), _jsxs(Label, { htmlFor: "inject-skills", className: "flex cursor-pointer items-center gap-1 text-xs font-medium", children: [_jsx(Puzzle, { className: "h-3 w-3" }), t('createDrawer.injectSkills')] })] }) }), _jsx(TooltipContent, { side: "bottom", children: t('createDrawer.injectSkillsDescription') })] }) })] }), _jsxs("div", { className: "border-input flex items-start gap-4 rounded-md border px-3 py-2.5", children: [_jsx("span", { className: "text-muted-foreground w-16 shrink-0 pt-0.5 text-xs font-semibold tracking-wider", children: t('createDrawer.git') }), _jsxs("div", { className: "flex flex-1 flex-wrap items-center gap-4", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: "push", size: "sm", checked: forkAndPr ? true : push || openPr, onCheckedChange: (v) => {
                                                                             setPush(v);
                                                                             if (!v && openPr)
                                                                                 setOpenPr(false);

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

@@ -1 +1 @@
-{"version":3,"file":"feature-create-drawer.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAU9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAgC1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAsDlD,uFAAuF;AACvF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,KAiBvB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAMhC,CAAC;AAEF,4DAA4D;AAC5D,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,KAUxB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,KAUvB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,KAUvB,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAAE,KAUxB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAgBjC,CAAC;AAgBF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAWlC,CAAC;AAkDF,+EAA+E;AAC/E,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAwCF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAM/B,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAgBjC,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,KAwCzB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAMF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAU9B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,wBAAwB,EAAE,KAatC,CAAC;AAuCF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AA6BF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAU/B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAa9B,CAAC"}
+{"version":3,"file":"feature-create-drawer.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAW9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAgC1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAsDlD,uFAAuF;AACvF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,KAiBvB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAMhC,CAAC;AAEF,4DAA4D;AAC5D,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,KAUxB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,KAUvB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,KAUvB,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAAE,KAUxB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAgBjC,CAAC;AAiBF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAWlC,CAAC;AAkDF,+EAA+E;AAC/E,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAwCF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAM/B,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAgBjC,CAAC;AAMF;;;;GAIG;AACH,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,KAwCzB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAMF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAU9B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,wBAAwB,EAAE,KAatC,CAAC;AAuCF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AA6BF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAU/B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAa9B,CAAC"}

package/dist/src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.stories.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { within, userEvent, fn, expect } from '@storybook/test';
 import { FeatureCreateDrawer } from './feature-create-drawer.js';
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { Button } from '../../ui/button.js';
 import { DrawerCloseGuardProvider } from '../../../hooks/drawer-close-guard.js';
 /* ---------------------------------------------------------------------------
@@ -271,7 +272,8 @@ const SAMPLE_WORKFLOW_DEFAULTS = {
     ciWatchEnabled: true,
     enableEvidence: true,
     commitEvidence: false,
-    fast: true,
+    defaultMode: FeatureMode.Fast,
+    injectSkills: false,
 };
 /**
  * Drawer pre-populated from workflow settings — PRD and Plan approval gates

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.d.ts

@@ -0,0 +1,8 @@
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
+export interface ModeSelectorProps {
+    value: FeatureMode;
+    onChange: (mode: FeatureMode) => void;
+    disabled?: boolean;
+}
+export declare function ModeSelector({ value, onChange, disabled }: ModeSelectorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=mode-selector.d.ts.map

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mode-selector.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/mode-selector.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAuBnE,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAmC5E"}

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.js

@@ -0,0 +1,33 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ClipboardList, Zap, FlaskConical } from 'lucide-react';
+import { ToggleGroup, ToggleGroupItem } from '../../ui/toggle-group.js';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../ui/tooltip.js';
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
+const MODE_OPTIONS = [
+    {
+        value: FeatureMode.Regular,
+        icon: ClipboardList,
+        label: 'Regular',
+        description: 'Full SDLC — requirements, research, planning, implementation, and review.',
+    },
+    {
+        value: FeatureMode.Fast,
+        icon: Zap,
+        label: 'Fast',
+        description: 'Direct implementation — skip SDLC phases, go straight to code.',
+    },
+    {
+        value: FeatureMode.Exploration,
+        icon: FlaskConical,
+        label: 'Explore',
+        description: 'Iterative prototyping — generate quick prototypes and iterate with feedback.',
+    },
+];
+export function ModeSelector({ value, onChange, disabled }) {
+    return (_jsx(TooltipProvider, { delayDuration: 300, children: _jsx(ToggleGroup, { type: "single", variant: "outline", size: "sm", value: value, onValueChange: (v) => {
+                // ToggleGroup emits empty string when clicking the already-selected item — ignore it
+                if (v)
+                    onChange(v);
+            }, disabled: disabled, "aria-label": "Feature mode", "data-testid": "mode-selector", children: MODE_OPTIONS.map((opt) => (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(ToggleGroupItem, { value: opt.value, "aria-label": opt.label, "data-testid": `mode-option-${opt.value.toLowerCase()}`, className: "data-[state=on]:bg-primary data-[state=on]:text-primary-foreground flex items-center gap-1 px-2 text-xs", children: [_jsx(opt.icon, { className: "h-3.5 w-3.5" }), opt.label] }) }), _jsx(TooltipContent, { side: "bottom", children: opt.description })] }, opt.value))) }) }));
+}

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { ModeSelector } from './mode-selector.js';
+declare const meta: Meta<typeof ModeSelector>;
+export default meta;
+type Story = StoryObj<typeof ModeSelector>;
+export declare const Regular: Story;
+export declare const Fast: Story;
+export declare const Exploration: Story;
+export declare const Disabled: Story;
+//# sourceMappingURL=mode-selector.stories.d.ts.map

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mode-selector.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/mode-selector.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAOnC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;AAO3C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC"}

package/dist/src/presentation/web/components/common/feature-create-drawer/mode-selector.stories.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ModeSelector } from './mode-selector.js';
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
+const meta = {
+    title: 'Drawers/Feature/ModeSelector',
+    component: ModeSelector,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+    },
+};
+export default meta;
+function InteractiveModeSelector({ initial = FeatureMode.Fast }) {
+    const [mode, setMode] = useState(initial);
+    return _jsx(ModeSelector, { value: mode, onChange: setMode });
+}
+export const Regular = {
+    render: () => _jsx(InteractiveModeSelector, { initial: FeatureMode.Regular }),
+};
+export const Fast = {
+    render: () => _jsx(InteractiveModeSelector, { initial: FeatureMode.Fast }),
+};
+export const Exploration = {
+    render: () => _jsx(InteractiveModeSelector, { initial: FeatureMode.Exploration }),
+};
+export const Disabled = {
+    args: {
+        value: FeatureMode.Fast,
+        onChange: () => undefined,
+        disabled: true,
+    },
+};

package/dist/src/presentation/web/components/common/feature-drawer-tabs/feature-drawer-tabs.d.ts

@@ -5,6 +5,7 @@ import type { TechDecisionsReviewData } from '../../common/tech-decisions-review
 import type { ProductDecisionsSummaryData } from '../../common/product-decisions-summary/index.js';
 import type { MergeReviewData } from '../../common/merge-review/index.js';
 import type { RejectAttachment } from '../../common/drawer-action-bar/index.js';
+import type { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
 import type { FeatureTabKey } from '../../common/control-center-drawer/drawer-view.js';
 import type { BranchSyncData } from '../../../hooks/use-branch-sync-status.js';
 import type { FeatureDrawerPinnedConfig } from './pinned-config-utils.js';
@@ -51,8 +52,12 @@ export interface FeatureDrawerTabsProps {
     onChatInputChange?: (value: string) => void;
     pinnedConfig?: FeatureDrawerPinnedConfig;
     continuationActionsDisabled?: boolean;
+    onSubmitFeedback?: (feedback: string) => Promise<void>;
+    onPromote?: (targetMode: FeatureMode.Regular | FeatureMode.Fast) => Promise<void>;
+    onDiscardExploration?: () => Promise<void>;
+    isPrototypeSubmitting?: boolean;
     /** When false, the Chat tab is hidden from the tab bar (FR-17). Defaults to true. */
     interactiveAgentEnabled?: boolean;
 }
-export declare function FeatureDrawerTabs({ featureName, headerContent, featureNode, featureId, initialTab, urlTab, prdData, prdSelections, onPrdSelect, onPrdApprove, onPrdReject, isPrdLoading, techData, onTechApprove, onTechReject, isTechLoading, productData, mergeData, onMergeApprove, onMergeReject, isMergeLoading, syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, isRejecting, chatInput, onChatInputChange, pinnedConfig, continuationActionsDisabled, sseEvents, interactiveAgentEnabled, onRetry, onStop, onStart, }: FeatureDrawerTabsProps): import("react/jsx-runtime").JSX.Element;
+export declare function FeatureDrawerTabs({ featureName, headerContent, featureNode, featureId, initialTab, urlTab, prdData, prdSelections, onPrdSelect, onPrdApprove, onPrdReject, isPrdLoading, techData, onTechApprove, onTechReject, isTechLoading, productData, mergeData, onMergeApprove, onMergeReject, isMergeLoading, syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, isRejecting, chatInput, onChatInputChange, pinnedConfig, continuationActionsDisabled, sseEvents, onSubmitFeedback, onPromote, onDiscardExploration, isPrototypeSubmitting, interactiveAgentEnabled, onRetry, onStop, onStart, }: FeatureDrawerTabsProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=feature-drawer-tabs.d.ts.map

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

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

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

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { usePathname } from 'next/navigation';
-import { Loader2, AlertCircle, LayoutDashboard, Activity, ScrollText, Map, FileCheck, Cpu, Package, GitMerge, MessageSquare, Play, Square, RotateCcw, Zap, Layers, } from 'lucide-react';
+import { Loader2, AlertCircle, LayoutDashboard, Activity, ScrollText, Map, FileCheck, Cpu, Package, GitMerge, MessageSquare, Play, Square, RotateCcw, Zap, Layers, FlaskConical, } from 'lucide-react';
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '../../ui/tabs.js';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../ui/tooltip.js';
 import { getFeaturePhaseTimings } from '../../../app/actions/get-feature-phase-timings.js';
@@ -20,12 +20,14 @@ import { OverviewTab } from './overview-tab.js';
 import { ActivityTab } from './activity-tab.js';
 import { LogTab } from './log-tab.js';
 import { PlanTab } from './plan-tab.js';
+import { PrototypeTab } from './prototype-tab.js';
 import { ChatTab } from '../../features/chat/ChatTab.js';
 import { useFeatureLogs } from '../../../hooks/use-feature-logs.js';
 import { useTabDataFetch } from './use-tab-data-fetch.js';
 /** All possible tabs in display order. */
 const ALL_TABS = [
     { key: 'overview', label: 'Overview', icon: LayoutDashboard },
+    { key: 'prototype', label: 'Prototype', icon: FlaskConical },
     { key: 'activity', label: 'Activity', icon: Activity },
     { key: 'log', label: 'Log', icon: ScrollText },
     { key: 'plan', label: 'Plan', icon: Map },
@@ -37,7 +39,17 @@ const ALL_TABS = [
 ];
 /** Compute which tabs are visible based on feature lifecycle + state. */
 function computeVisibleTabs(node, interactiveAgentEnabled = true) {
-    const tabs = ['overview', 'activity'];
+    const tabs = ['overview'];
+    // Exploration mode: show prototype tab, skip SDLC-specific tabs
+    if (node.lifecycle === 'exploring') {
+        tabs.push('prototype', 'activity');
+        if (node.hasAgentRun)
+            tabs.push('log');
+        if (interactiveAgentEnabled)
+            tabs.push('chat');
+        return tabs;
+    }
+    tabs.push('activity');
     if (node.hasAgentRun) {
         tabs.push('log');
     }
@@ -78,7 +90,7 @@ const TAB_FETCHERS = {
     activity: fetchActivity,
     plan: fetchPlan,
 };
-export function FeatureDrawerTabs({ featureName, headerContent, featureNode, featureId, initialTab, urlTab, prdData, prdSelections, onPrdSelect, onPrdApprove, onPrdReject, isPrdLoading, techData, onTechApprove, onTechReject, isTechLoading, productData, mergeData, onMergeApprove, onMergeReject, isMergeLoading, syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, isRejecting, chatInput, onChatInputChange, pinnedConfig, continuationActionsDisabled = false, sseEvents, interactiveAgentEnabled = true, onRetry, onStop, onStart, }) {
+export function FeatureDrawerTabs({ featureName, headerContent, featureNode, featureId, initialTab, urlTab, prdData, prdSelections, onPrdSelect, onPrdApprove, onPrdReject, isPrdLoading, techData, onTechApprove, onTechReject, isTechLoading, productData, mergeData, onMergeApprove, onMergeReject, isMergeLoading, syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, isRejecting, chatInput, onChatInputChange, pinnedConfig, continuationActionsDisabled = false, sseEvents, onSubmitFeedback, onPromote, onDiscardExploration, isPrototypeSubmitting, interactiveAgentEnabled = true, onRetry, onStop, onStart, }) {
     const pathname = usePathname();
     const visibleTabs = useMemo(() => computeVisibleTabs(featureNode, interactiveAgentEnabled), [featureNode, interactiveAgentEnabled]);
     const visibleTabDefs = useMemo(() => ALL_TABS.filter((t) => visibleTabs.includes(t.key)).map((t) => t.key === 'merge-review' && featureNode.lifecycle === 'maintain'
@@ -263,7 +275,7 @@ export function FeatureDrawerTabs({ featureName, headerContent, featureNode, fea
                                                                     return _jsx(I, { className: "size-3.5 shrink-0" });
                                                                 })()), featureNodeStateConfig[featureNode.state].label] }), featureNode.state === 'pending' && onStart ? (_jsxs("button", { type: "button", onClick: () => onStart(featureNode.featureId), disabled: continuationActionsDisabled, className: "text-muted-foreground flex items-center gap-1 self-stretch px-3 hover:bg-green-500/10 hover:text-green-600 disabled:pointer-events-none disabled:opacity-50 dark:hover:text-green-400", "data-testid": "feature-drawer-start-button", children: [_jsx(Play, { className: "size-3.5" }), " Start"] })) : featureNode.state === 'error' && onRetry ? (_jsxs("button", { type: "button", onClick: () => onRetry(featureNode.featureId), disabled: continuationActionsDisabled, className: "text-muted-foreground flex items-center gap-1 self-stretch px-3 hover:bg-red-500/10 hover:text-red-500 disabled:pointer-events-none disabled:opacity-50 dark:hover:text-red-400", "data-testid": "feature-drawer-retry-button", children: [_jsx(RotateCcw, { className: "size-3.5" }), " Retry"] })) : featureNode.state === 'running' && onStop ? (_jsxs("button", { type: "button", onClick: () => onStop(featureNode.featureId), className: "text-muted-foreground flex items-center gap-1 self-stretch px-3 hover:bg-red-500/10 hover:text-red-500 dark:hover:text-red-400", "data-testid": "feature-drawer-stop-button", children: [_jsx(Square, { className: "size-3.5" }), " Stop"] })) : null] }) }), featureNode.errorMessage ? (_jsxs(TooltipContent, { side: "bottom", align: "end", sideOffset: 4, className: "z-[100] max-w-xs cursor-pointer text-xs leading-relaxed select-text", onClick: () => {
                                                     void navigator.clipboard.writeText(featureNode.errorMessage);
-                                                }, children: [featureNode.errorMessage, _jsx("span", { className: "text-muted-foreground ml-1 text-[10px] italic", children: "(click to copy)" })] })) : null] }) })] })) : null, headerContent] }), _jsx(TabsContent, { value: "overview", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(OverviewTab, { data: featureNode, pinnedConfig: pinnedConfig, syncStatus: syncStatus, syncLoading: syncLoading, syncError: syncError, onRefreshSync: onRefreshSync, onRebaseOnMain: onRebaseOnMain, rebaseLoading: rebaseLoading, rebaseError: rebaseError }) }), _jsx(TabsContent, { value: "activity", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(ActivityTab, { timings: tabs.activity.data?.timings ?? null, loading: tabs.activity.loading, error: tabs.activity.error, rejectionFeedback: tabs.activity.data?.rejectionFeedback }) }), _jsx(TabsContent, { value: "log", className: "mt-0 flex-1 overflow-hidden", children: _jsx(LogTab, { content: featureLogs.content, isConnected: featureLogs.isConnected, error: featureLogs.error }) }), _jsx(TabsContent, { value: "plan", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(PlanTab, { plan: tabs.plan.data, loading: tabs.plan.loading, error: tabs.plan.error }) }), visibleTabs.includes('prd-review') ? (_jsx(TabsContent, { value: "prd-review", className: "mt-0 flex min-h-0 flex-1 flex-col", children: prdData ? (_jsx(PrdQuestionnaire, { data: prdData, selections: prdSelections ?? {}, onSelect: onPrdSelect ?? (() => undefined), onApprove: onPrdApprove ?? (() => undefined), onReject: onPrdReject, isProcessing: Boolean((isPrdLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) })) : null, visibleTabs.includes('tech-decisions') ? (_jsx(TabsContent, { value: "tech-decisions", className: "mt-0 flex min-h-0 flex-1 flex-col", children: techData ? (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [_jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(TechDecisionsContent, { data: techData }) }), _jsx(DrawerActionBarForTech, { onApprove: onTechApprove ?? (() => undefined), onReject: onTechReject, isProcessing: Boolean((isTechLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })] })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) })) : null, visibleTabs.includes('product-decisions') ? (_jsx(TabsContent, { value: "product-decisions", className: "mt-0 flex-1 overflow-y-auto", children: productData === null ? (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) : productData ? (_jsx(ProductDecisionsSummary, { data: productData })) : (_jsx("p", { className: "text-muted-foreground p-4 text-center text-sm", children: "No product decisions available." })) })) : null, visibleTabs.includes('merge-review') ? (_jsx(TabsContent, { value: "merge-review", className: "mt-0 flex min-h-0 flex-1 flex-col", children: mergeData ? (_jsx(MergeReview, { data: mergeData, readOnly: featureNode.lifecycle === 'maintain', onApprove: onMergeApprove ?? (() => undefined), onReject: onMergeReject, isProcessing: Boolean((isMergeLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: isMergeLoading ? (_jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" })) : (_jsxs("div", { className: "text-muted-foreground flex flex-col items-center gap-2 text-sm", children: [_jsx(AlertCircle, { className: "h-6 w-6" }), _jsx("span", { children: "Merge review data unavailable" })] })) })) })) : null, visibleTabs.includes('chat') ? (_jsx(TabsContent, { value: "chat", className: "mt-0 flex min-h-0 flex-1 flex-col overflow-hidden", children: _jsx(ChatTab, { featureId: featureId, worktreePath: featureNode.worktreePath }) })) : null] }) }));
+                                                }, children: [featureNode.errorMessage, _jsx("span", { className: "text-muted-foreground ml-1 text-[10px] italic", children: "(click to copy)" })] })) : null] }) })] })) : null, headerContent] }), _jsx(TabsContent, { value: "overview", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(OverviewTab, { data: featureNode, pinnedConfig: pinnedConfig, syncStatus: syncStatus, syncLoading: syncLoading, syncError: syncError, onRefreshSync: onRefreshSync, onRebaseOnMain: onRebaseOnMain, rebaseLoading: rebaseLoading, rebaseError: rebaseError }) }), visibleTabs.includes('prototype') ? (_jsx(TabsContent, { value: "prototype", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(PrototypeTab, { data: featureNode, onSubmitFeedback: onSubmitFeedback, onPromote: onPromote, onDiscard: onDiscardExploration, isSubmitting: isPrototypeSubmitting }) })) : null, _jsx(TabsContent, { value: "activity", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(ActivityTab, { timings: tabs.activity.data?.timings ?? null, loading: tabs.activity.loading, error: tabs.activity.error, rejectionFeedback: tabs.activity.data?.rejectionFeedback }) }), _jsx(TabsContent, { value: "log", className: "mt-0 flex-1 overflow-hidden", children: _jsx(LogTab, { content: featureLogs.content, isConnected: featureLogs.isConnected, error: featureLogs.error }) }), _jsx(TabsContent, { value: "plan", className: "mt-0 flex-1 overflow-y-auto", children: _jsx(PlanTab, { plan: tabs.plan.data, loading: tabs.plan.loading, error: tabs.plan.error }) }), visibleTabs.includes('prd-review') ? (_jsx(TabsContent, { value: "prd-review", className: "mt-0 flex min-h-0 flex-1 flex-col", children: prdData ? (_jsx(PrdQuestionnaire, { data: prdData, selections: prdSelections ?? {}, onSelect: onPrdSelect ?? (() => undefined), onApprove: onPrdApprove ?? (() => undefined), onReject: onPrdReject, isProcessing: Boolean((isPrdLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) })) : null, visibleTabs.includes('tech-decisions') ? (_jsx(TabsContent, { value: "tech-decisions", className: "mt-0 flex min-h-0 flex-1 flex-col", children: techData ? (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [_jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(TechDecisionsContent, { data: techData }) }), _jsx(DrawerActionBarForTech, { onApprove: onTechApprove ?? (() => undefined), onReject: onTechReject, isProcessing: Boolean((isTechLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })] })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) })) : null, visibleTabs.includes('product-decisions') ? (_jsx(TabsContent, { value: "product-decisions", className: "mt-0 flex-1 overflow-y-auto", children: productData === null ? (_jsx("div", { className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) })) : productData ? (_jsx(ProductDecisionsSummary, { data: productData })) : (_jsx("p", { className: "text-muted-foreground p-4 text-center text-sm", children: "No product decisions available." })) })) : null, visibleTabs.includes('merge-review') ? (_jsx(TabsContent, { value: "merge-review", className: "mt-0 flex min-h-0 flex-1 flex-col", children: mergeData ? (_jsx(MergeReview, { data: mergeData, readOnly: featureNode.lifecycle === 'maintain', onApprove: onMergeApprove ?? (() => undefined), onReject: onMergeReject, isProcessing: Boolean((isMergeLoading ?? false) || continuationActionsDisabled), isRejecting: isRejecting, chatInput: chatInput, onChatInputChange: onChatInputChange })) : (_jsx("div", { className: "flex items-center justify-center p-8", children: isMergeLoading ? (_jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" })) : (_jsxs("div", { className: "text-muted-foreground flex flex-col items-center gap-2 text-sm", children: [_jsx(AlertCircle, { className: "h-6 w-6" }), _jsx("span", { children: "Merge review data unavailable" })] })) })) })) : null, visibleTabs.includes('chat') ? (_jsx(TabsContent, { value: "chat", className: "mt-0 flex min-h-0 flex-1 flex-col overflow-hidden", children: _jsx(ChatTab, { featureId: featureId, worktreePath: featureNode.worktreePath }) })) : null] }) }));
 }
 // ── Private helper ──────────────────────────────────────────────────────
 function DrawerActionBarForTech({ onApprove, onReject, isProcessing, isRejecting, chatInput, onChatInputChange, }) {

package/dist/src/presentation/web/components/common/feature-drawer-tabs/overview-tab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overview-tab.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/overview-tab.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAQxE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAyB,KAAK,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AA2G9F,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,eAAe,CAAC;IACtB,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,UAAU,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,aAAa,EACb,cAAc,EACd,aAAa,EACb,WAAW,GACZ,EAAE,gBAAgB,2CAuLlB"}
+{"version":3,"file":"overview-tab.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/overview-tab.tsx"],"names":[],"mappings":"AA8BA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAQxE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAyB,KAAK,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AA2G9F,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,eAAe,CAAC;IACtB,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,UAAU,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,aAAa,EACb,cAAc,EACd,aAAa,EACb,WAAW,GACZ,EAAE,gBAAgB,2CA0LlB"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/overview-tab.js

@@ -2,10 +2,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
-import { AlertTriangle, Check, CheckCircle2, Clock, ExternalLink, FileSearch, GitBranch, GitCommitHorizontal, GitMerge, Info, RefreshCw, Settings, ShieldCheck, X, Zap, } from 'lucide-react';
+import { AlertTriangle, Check, CheckCircle2, Clock, ExternalLink, FileSearch, GitBranch, GitCommitHorizontal, GitMerge, Info, Puzzle, RefreshCw, Settings, ShieldCheck, X, Zap, } from 'lucide-react';
 import { InlineAttachments } from '../../common/inline-attachments/index.js';
 import { PrStatus } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { cn } from '../../../lib/utils.js';
+import { Badge } from '../../ui/badge.js';
 import { CiStatusBadge } from '../../common/ci-status-badge/index.js';
 import { CometSpinner } from '../../ui/comet-spinner.js';
 import { ActionButton } from '../../common/action-button/index.js';
@@ -88,7 +89,7 @@ export function OverviewTab({ data, pinnedConfig, syncStatus, syncLoading, syncE
                                             return _jsx(I, { className: "size-3.5 shrink-0 opacity-50" });
                                         })()
                                         : null, data.agentType ? (_jsx("span", { children: agentTypeLabels[data.agentType] ??
-                                            data.agentType })) : null, data.agentType && data.modelId ? (_jsx("span", { className: "text-foreground/20", children: "/" })) : null, data.modelId ? (_jsx("span", { className: "text-foreground/50 text-[12px]", children: getModelMeta(data.modelId).displayName || data.modelId })) : null] }) }) })) : null, data.createdAt ? (_jsx(Card, { children: _jsx(KV, { label: "Created", children: _jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(Clock, { className: "text-foreground/30 size-3 shrink-0" }), formatRelativeTime(data.createdAt)] }) }) })) : null, data.fastMode ? (_jsx(Card, { children: _jsx(KV, { label: "Mode", children: _jsxs("span", { className: "inline-flex items-center gap-1 text-amber-600 dark:text-amber-400", children: [_jsx(Zap, { className: "size-3.5" }), " Fast"] }) }) })) : null, data.runtime || elapsedTime ? (_jsx(Card, { children: _jsx(KV, { label: data.runtime ? 'Runtime' : 'Elapsed', children: _jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(Clock, { className: "text-foreground/30 size-3 shrink-0" }), data.runtime ?? elapsedTime] }) }) })) : null] }), data.blockedBy || data.errorMessage ? (_jsx(Section, { icon: AlertTriangle, title: "Issues", children: _jsxs(Card, { className: "border-destructive/20 bg-destructive/5", children: [data.blockedBy ? _jsx(KV, { label: "Blocked By", children: data.blockedBy }) : null, data.errorMessage ? (_jsx(KV, { label: "Error", children: _jsx("span", { className: "text-destructive", children: data.errorMessage }) })) : null] }) })) : null, onRebaseOnMain && data.branch && onRefreshSync ? (_jsx(Section, { icon: RefreshCw, title: "Branch Sync", children: _jsx(SyncCard, { syncStatus: syncStatus ?? null, syncLoading: syncLoading ?? false, syncError: syncError ?? null, onRefreshSync: onRefreshSync, onRebaseOnMain: onRebaseOnMain, rebaseLoading: rebaseLoading ?? false, rebaseError: rebaseError ?? null }) })) : null, _jsx(SettingsBlock, { data: data, pinnedConfig: pinnedConfig })] }));
+                                            data.agentType })) : null, data.agentType && data.modelId ? (_jsx("span", { className: "text-foreground/20", children: "/" })) : null, data.modelId ? (_jsx("span", { className: "text-foreground/50 text-[12px]", children: getModelMeta(data.modelId).displayName || data.modelId })) : null] }) }) })) : null, data.createdAt ? (_jsx(Card, { children: _jsx(KV, { label: "Created", children: _jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(Clock, { className: "text-foreground/30 size-3 shrink-0" }), formatRelativeTime(data.createdAt)] }) }) })) : null, data.fastMode ? (_jsx(Card, { children: _jsx(KV, { label: "Mode", children: _jsxs("span", { className: "inline-flex items-center gap-1 text-amber-600 dark:text-amber-400", children: [_jsx(Zap, { className: "size-3.5" }), " Fast"] }) }) })) : null, data.runtime || elapsedTime ? (_jsx(Card, { children: _jsx(KV, { label: data.runtime ? 'Runtime' : 'Elapsed', children: _jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(Clock, { className: "text-foreground/30 size-3 shrink-0" }), data.runtime ?? elapsedTime] }) }) })) : null] }), data.blockedBy || data.errorMessage ? (_jsx(Section, { icon: AlertTriangle, title: "Issues", children: _jsxs(Card, { className: "border-destructive/20 bg-destructive/5", children: [data.blockedBy ? _jsx(KV, { label: "Blocked By", children: data.blockedBy }) : null, data.errorMessage ? (_jsx(KV, { label: "Error", children: _jsx("span", { className: "text-destructive", children: data.errorMessage }) })) : null] }) })) : null, onRebaseOnMain && data.branch && onRefreshSync ? (_jsx(Section, { icon: RefreshCw, title: "Branch Sync", children: _jsx(SyncCard, { syncStatus: syncStatus ?? null, syncLoading: syncLoading ?? false, syncError: syncError ?? null, onRefreshSync: onRefreshSync, onRebaseOnMain: onRebaseOnMain, rebaseLoading: rebaseLoading ?? false, rebaseError: rebaseError ?? null }) })) : null, _jsx(SettingsBlock, { data: data, pinnedConfig: pinnedConfig }), data.injectedSkills?.length ? _jsx(InjectedSkillsSection, { skills: data.injectedSkills }) : null] }));
 }
 // ── Sync card ───────────────────────────────────────────────────────
 function SyncCard({ syncStatus, syncLoading, syncError, onRefreshSync, onRebaseOnMain, rebaseLoading, rebaseError, }) {
@@ -114,13 +115,18 @@ function SettingsBlock({ data, pinnedConfig, }) {
         data.ciWatchEnabled != null ||
         data.enableEvidence != null ||
         data.forkAndPr != null ||
-        data.commitSpecs != null;
+        data.commitSpecs != null ||
+        data.injectSkills != null;
     const showPinnedConfig = pinnedConfig != null && canSwitchPinnedConfig(data.state);
     if (!hasSettings && !showPinnedConfig)
         return null;
-    return (_jsx(Section, { icon: Settings, title: "Settings", children: _jsxs("div", { className: "flex flex-col gap-2", children: [showPinnedConfig ? _jsx(PinnedConfigCard, { pinnedConfig: pinnedConfig }) : null, hasSettings ? (_jsxs("div", { className: "grid grid-cols-3 gap-2", children: [data.approvalGates ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(ShieldCheck, { className: "size-3" }), " Approve"] }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx(Flag, { on: data.approvalGates.allowPrd, label: "PRD" }), _jsx(Flag, { on: data.approvalGates.allowPlan, label: "Plan" }), _jsx(Flag, { on: data.approvalGates.allowMerge, label: "Merge" })] })] })) : null, data.enableEvidence != null ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(FileSearch, { className: "size-3" }), " Evidence"] }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx(Flag, { on: data.enableEvidence, label: "Collect" }), data.commitEvidence != null ? (_jsx(Flag, { on: data.commitEvidence, label: "Add to PR" })) : null] })] })) : null, data.push != null ||
+    return (_jsx(Section, { icon: Settings, title: "Settings", children: _jsxs("div", { className: "flex flex-col gap-2", children: [showPinnedConfig ? _jsx(PinnedConfigCard, { pinnedConfig: pinnedConfig }) : null, hasSettings ? (_jsxs("div", { className: "grid grid-cols-3 gap-2", children: [data.approvalGates ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(ShieldCheck, { className: "size-3" }), " Approve"] }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx(Flag, { on: data.approvalGates.allowPrd, label: "PRD" }), _jsx(Flag, { on: data.approvalGates.allowPlan, label: "Plan" }), _jsx(Flag, { on: data.approvalGates.allowMerge, label: "Merge" })] })] })) : null, data.enableEvidence != null ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(FileSearch, { className: "size-3" }), " Evidence"] }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx(Flag, { on: data.enableEvidence, label: "Collect" }), data.commitEvidence != null ? (_jsx(Flag, { on: data.commitEvidence, label: "Add to PR" })) : null] })] })) : null, data.injectSkills != null ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(Puzzle, { className: "size-3" }), " Skills"] }), _jsx("div", { className: "flex flex-col gap-0.5", children: _jsx(Flag, { on: data.injectSkills, label: "Inject" }) })] })) : null, data.push != null ||
                             data.openPr != null ||
                             data.ciWatchEnabled != null ||
                             data.commitSpecs != null ||
                             data.forkAndPr != null ? (_jsxs(Card, { children: [_jsxs("div", { className: "text-foreground/40 mb-1.5 flex items-center gap-1 text-[10px] font-medium tracking-wider uppercase", children: [_jsx(GitBranch, { className: "size-3" }), " Git"] }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [data.push != null ? _jsx(Flag, { on: data.push, label: "Push" }) : null, data.openPr != null ? _jsx(Flag, { on: data.openPr, label: "PR" }) : null, data.ciWatchEnabled != null ? (_jsx(Flag, { on: data.ciWatchEnabled, label: "Watch" })) : null, data.commitSpecs != null ? _jsx(Flag, { on: data.commitSpecs, label: "Specs" }) : null, data.forkAndPr != null ? _jsx(Flag, { on: data.forkAndPr, label: "Fork" }) : null] })] })) : null] })) : null] }) }));
 }
+// ── Injected Skills ────────────────────────────────────────────────
+function InjectedSkillsSection({ skills }) {
+    return (_jsx(Section, { icon: Puzzle, title: "Feature Skills", children: _jsx("div", { className: "flex flex-wrap gap-1.5", children: skills.map((name) => (_jsx(Badge, { variant: "secondary", children: name }, name))) }) }));
+}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/overview-tab.stories.d.ts

@@ -59,4 +59,6 @@ export declare const WithRebaseAction: Story;
 export declare const RebaseLoading: Story;
 /** Rebase action showing error. */
 export declare const RebaseError: Story;
+/** Feature with injected skills displayed in a dedicated section. */
+export declare const WithInjectedSkills: Story;
 //# sourceMappingURL=overview-tab.stories.d.ts.map

package/dist/src/presentation/web/components/common/feature-drawer-tabs/overview-tab.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overview-tab.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/overview-tab.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAclC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AA0G1C,uEAAuE;AACvE,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,yDAAyD;AACzD,eAAO,MAAM,UAAU,EAAE,KAExB,CAAC;AAEF,wDAAwD;AACxD,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AAEF,iDAAiD;AACjD,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,gDAAgD;AAChD,eAAO,MAAM,KAAK,EAAE,KAEnB,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,6BAA6B,EAAE,KAc3C,CAAC;AAEF,oFAAoF;AACpF,eAAO,MAAM,4BAA4B,EAAE,KAe1C,CAAC;AAOF,6CAA6C;AAC7C,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,eAAe,EAAE,KAE7B,CAAC;AAEF,sEAAsE;AACtE,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAwBF,mEAAmE;AACnE,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAMF,0BAA0B;AAC1B,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AAEF,sBAAsB;AACtB,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AAEF,oBAAoB;AACpB,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,sBAAsB;AACtB,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,oBAAoB,EAAE,KAclC,CAAC;AAqBF,4DAA4D;AAC5D,eAAO,MAAM,sBAAsB,EAAE,KAEpC,CAAC;AAEF,sDAAsD;AACtD,eAAO,MAAM,gBAAgB,EAAE,KAO9B,CAAC;AAEF,+FAA+F;AAC/F,eAAO,MAAM,eAAe,EAAE,KAgB7B,CAAC;AAMF,oFAAoF;AACpF,eAAO,MAAM,eAAe,EAAE,KAY7B,CAAC;AAEF,kDAAkD;AAClD,eAAO,MAAM,uBAAuB,EAAE,KAYrC,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,uBAAuB,EAAE,KAYrC,CAAC;AAEF,2CAA2C;AAC3C,eAAO,MAAM,oBAAoB,EAAE,KAYlC,CAAC;AAEF,+DAA+D;AAC/D,eAAO,MAAM,mBAAmB,EAAE,KAQjC,CAAC;AAMF,6EAA6E;AAC7E,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,sCAAsC;AACtC,eAAO,MAAM,aAAa,EAAE,KAO3B,CAAC;AAEF,mCAAmC;AACnC,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC"}
+{"version":3,"file":"overview-tab.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/overview-tab.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAclC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AA0G1C,uEAAuE;AACvE,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,yDAAyD;AACzD,eAAO,MAAM,UAAU,EAAE,KAExB,CAAC;AAEF,wDAAwD;AACxD,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AAEF,iDAAiD;AACjD,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,gDAAgD;AAChD,eAAO,MAAM,KAAK,EAAE,KAEnB,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,6BAA6B,EAAE,KAc3C,CAAC;AAEF,oFAAoF;AACpF,eAAO,MAAM,4BAA4B,EAAE,KAe1C,CAAC;AAOF,6CAA6C;AAC7C,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,eAAe,EAAE,KAE7B,CAAC;AAEF,sEAAsE;AACtE,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAwBF,mEAAmE;AACnE,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAMF,0BAA0B;AAC1B,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AAEF,sBAAsB;AACtB,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AAEF,oBAAoB;AACpB,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,sBAAsB;AACtB,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,oBAAoB,EAAE,KAclC,CAAC;AAqBF,4DAA4D;AAC5D,eAAO,MAAM,sBAAsB,EAAE,KAEpC,CAAC;AAEF,sDAAsD;AACtD,eAAO,MAAM,gBAAgB,EAAE,KAO9B,CAAC;AAEF,+FAA+F;AAC/F,eAAO,MAAM,eAAe,EAAE,KAgB7B,CAAC;AAMF,oFAAoF;AACpF,eAAO,MAAM,eAAe,EAAE,KAY7B,CAAC;AAEF,kDAAkD;AAClD,eAAO,MAAM,uBAAuB,EAAE,KAYrC,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,uBAAuB,EAAE,KAYrC,CAAC;AAEF,2CAA2C;AAC3C,eAAO,MAAM,oBAAoB,EAAE,KAYlC,CAAC;AAEF,+DAA+D;AAC/D,eAAO,MAAM,mBAAmB,EAAE,KAQjC,CAAC;AAMF,6EAA6E;AAC7E,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,sCAAsC;AACtC,eAAO,MAAM,aAAa,EAAE,KAO3B,CAAC;AAEF,mCAAmC;AACnC,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAMF,qEAAqE;AACrE,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/overview-tab.stories.js

@@ -392,3 +392,15 @@ export const RebaseError = {
         rebaseError: 'Rebase failed: unresolvable conflicts in src/index.ts',
     },
 };
+/* ---------------------------------------------------------------------------
+ * Injected skills stories
+ * ------------------------------------------------------------------------- */
+/** Feature with injected skills displayed in a dedicated section. */
+export const WithInjectedSkills = {
+    args: {
+        data: {
+            ...fullData,
+            injectedSkills: ['architecture-reviewer', 'cross-validate-artifacts', 'tsp-model'],
+        },
+    },
+};

package/dist/src/presentation/web/components/common/feature-drawer-tabs/prototype-tab.d.ts

@@ -0,0 +1,11 @@
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
+import type { FeatureNodeData } from '../../common/feature-node/index.js';
+export interface PrototypeTabProps {
+    data: FeatureNodeData;
+    onSubmitFeedback?: (feedback: string) => Promise<void>;
+    onPromote?: (targetMode: FeatureMode.Regular | FeatureMode.Fast) => Promise<void>;
+    onDiscard?: () => Promise<void>;
+    isSubmitting?: boolean;
+}
+export declare function PrototypeTab({ data, onSubmitFeedback, onPromote, onDiscard, isSubmitting, }: PrototypeTabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=prototype-tab.d.ts.map

package/dist/src/presentation/web/components/common/feature-drawer-tabs/prototype-tab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prototype-tab.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/prototype-tab.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AACnE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAExE,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,eAAe,CAAC;IACtB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,OAAO,GAAG,WAAW,CAAC,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClF,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,gBAAgB,EAChB,SAAS,EACT,SAAS,EACT,YAAoB,GACrB,EAAE,iBAAiB,2CAyKnB"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/prototype-tab.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from 'react';
+import { FlaskConical, ArrowUpRight, Trash2, Loader2, Send } from 'lucide-react';
+import { Button } from '../../ui/button.js';
+import { Textarea } from '../../ui/textarea.js';
+import { Badge } from '../../ui/badge.js';
+import { Separator } from '../../ui/separator.js';
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from '../../ui/alert-dialog.js';
+import { FeatureMode } from '../../../../../../packages/core/src/domain/generated/output.js';
+export function PrototypeTab({ data, onSubmitFeedback, onPromote, onDiscard, isSubmitting = false, }) {
+    const [feedback, setFeedback] = useState('');
+    const [discardDialogOpen, setDiscardDialogOpen] = useState(false);
+    const [promoteDialogOpen, setPromoteDialogOpen] = useState(false);
+    const handleSubmitFeedback = useCallback(async () => {
+        if (!feedback.trim() || !onSubmitFeedback)
+            return;
+        await onSubmitFeedback(feedback.trim());
+        setFeedback('');
+    }, [feedback, onSubmitFeedback]);
+    const handlePromote = useCallback(async (targetMode) => {
+        setPromoteDialogOpen(false);
+        await onPromote?.(targetMode);
+    }, [onPromote]);
+    const handleDiscard = useCallback(async () => {
+        setDiscardDialogOpen(false);
+        await onDiscard?.();
+    }, [onDiscard]);
+    const isWaitingFeedback = data.state === 'action-required' && data.lifecycle === 'exploring';
+    const isGenerating = data.state === 'running' && data.lifecycle === 'exploring';
+    return (_jsxs("div", { className: "flex flex-col gap-4 p-4", "data-testid": "prototype-tab", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(FlaskConical, { className: "h-4 w-4 text-amber-500" }), _jsx("span", { className: "text-sm font-medium", children: "Exploration Prototype" }), (data.iterationCount ?? 0) > 0 && (_jsxs(Badge, { variant: "secondary", "data-testid": "prototype-iteration-badge", children: ["Iteration ", data.iterationCount] })), isGenerating ? (_jsxs(Badge, { variant: "outline", className: "text-teal-600 dark:text-teal-400", children: [_jsx(Loader2, { className: "mr-1 h-3 w-3 animate-spin" }), "Generating..."] })) : null, isWaitingFeedback ? (_jsx(Badge, { variant: "outline", className: "text-amber-600 dark:text-amber-400", children: "Awaiting feedback" })) : null] }), _jsx(Separator, {}), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("label", { htmlFor: "prototype-feedback", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "Feedback" }), _jsx(Textarea, { id: "prototype-feedback", placeholder: isWaitingFeedback
+                            ? 'Describe what to change in the next iteration...'
+                            : 'Feedback can be submitted when the prototype is ready for review.', value: feedback, onChange: (e) => setFeedback(e.target.value), disabled: !isWaitingFeedback || isSubmitting, className: "min-h-24 resize-none", "data-testid": "prototype-feedback-input" }), _jsxs(Button, { onClick: handleSubmitFeedback, disabled: !feedback.trim() || !isWaitingFeedback || isSubmitting, size: "sm", className: "self-end", "data-testid": "prototype-submit-feedback", children: [isSubmitting ? (_jsx(Loader2, { className: "mr-1 h-3.5 w-3.5 animate-spin" })) : (_jsx(Send, { className: "mr-1 h-3.5 w-3.5" })), "Send Feedback"] })] }), _jsx(Separator, {}), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { variant: "default", size: "sm", onClick: () => setPromoteDialogOpen(true), disabled: !isWaitingFeedback || isSubmitting, "data-testid": "prototype-promote-button", children: [_jsx(ArrowUpRight, { className: "mr-1 h-3.5 w-3.5" }), "Promote to Feature"] }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => setDiscardDialogOpen(true), disabled: isSubmitting, className: "text-destructive hover:text-destructive", "data-testid": "prototype-discard-button", children: [_jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), "Discard"] })] }), _jsx(AlertDialog, { open: promoteDialogOpen, onOpenChange: setPromoteDialogOpen, children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Promote to Feature" }), _jsx(AlertDialogDescription, { children: "Choose the mode for the promoted feature. The prototype code will be preserved as the starting point." })] }), _jsxs(AlertDialogFooter, { className: "flex-col gap-2 sm:flex-row", children: [_jsx(AlertDialogCancel, { children: "Cancel" }), _jsx(AlertDialogAction, { onClick: () => handlePromote(FeatureMode.Fast), "data-testid": "promote-fast", children: "Fast (Direct Implementation)" }), _jsx(AlertDialogAction, { onClick: () => handlePromote(FeatureMode.Regular), "data-testid": "promote-regular", children: "Regular (Full SDLC)" })] })] }) }), _jsx(AlertDialog, { open: discardDialogOpen, onOpenChange: setDiscardDialogOpen, children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Discard Exploration?" }), _jsx(AlertDialogDescription, { children: "This will delete the exploration feature, its worktree, and all prototype code. This action cannot be undone." })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Cancel" }), _jsx(AlertDialogAction, { onClick: handleDiscard, className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", "data-testid": "discard-confirm", children: "Discard" })] })] }) })] }));
+}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/prototype-tab.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PrototypeTab } from './prototype-tab.js';
+declare const meta: Meta<typeof PrototypeTab>;
+export default meta;
+type Story = StoryObj<typeof PrototypeTab>;
+/** First iteration — prototype just generated, awaiting feedback. */
+export declare const FirstIteration: Story;
+/** Mid-iteration — user has given multiple rounds of feedback. */
+export declare const MidIteration: Story;
+/** Generating — the agent is currently producing a prototype. */
+export declare const Generating: Story;
+/** Submitting feedback — loading state while feedback is being sent. */
+export declare const Submitting: Story;
+/** Zero iterations — just created, no prototype yet. */
+export declare const ZeroIterations: Story;
+//# sourceMappingURL=prototype-tab.stories.d.ts.map