@shepai/cli 1.22.1 → 1.23.0

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

@@ -0,0 +1,7 @@
+import type { FeatureNodeData } from '../../common/feature-node/index.js';
+export interface FeatureDrawerProps {
+    selectedNode: FeatureNodeData | null;
+    onClose: () => void;
+}
+export declare function FeatureDrawer({ selectedNode, onClose }: FeatureDrawerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=feature-drawer.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"feature-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer/feature-drawer.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAExE,MAAM,WAAW,kBAAkB;IACjC,YAAY,EAAE,eAAe,GAAG,IAAI,CAAC;IACrC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAAE,YAAY,EAAE,OAAO,EAAE,EAAE,kBAAkB,2CAmE1E"}

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

@@ -0,0 +1,28 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { XIcon } from 'lucide-react';
+import { cn } from '../../../lib/utils.js';
+import { Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerDescription, } from '../../ui/drawer.js';
+import { Separator } from '../../ui/separator.js';
+import { CometSpinner } from '../../ui/comet-spinner.js';
+import { featureNodeStateConfig, lifecycleDisplayLabels } from '../../common/feature-node/index.js';
+export function FeatureDrawer({ selectedNode, onClose }) {
+    return (_jsx(Drawer, { direction: "right", modal: false, open: selectedNode !== null, onOpenChange: (open) => {
+            if (!open)
+                onClose();
+        }, children: _jsx(DrawerContent, { direction: "right", className: "w-96", showCloseButton: false, children: selectedNode ? (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", "aria-label": "Close", onClick: onClose, className: "ring-offset-background focus:ring-ring absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden", children: _jsx(XIcon, { className: "size-4" }) }), _jsxs(DrawerHeader, { "data-testid": "feature-drawer-header", children: [_jsx(DrawerTitle, { children: selectedNode.name }), _jsx(DrawerDescription, { children: selectedNode.featureId })] }), _jsx(Separator, {}), _jsxs("div", { "data-testid": "feature-drawer-status", className: "flex flex-col gap-3 p-4", children: [_jsx("div", { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: lifecycleDisplayLabels[selectedNode.lifecycle] }), _jsx(StateBadge, { data: selectedNode }), selectedNode.progress > 0 ? (_jsxs("div", { "data-testid": "feature-drawer-progress", className: "flex flex-col gap-1", children: [_jsxs("div", { className: "text-muted-foreground flex items-center justify-between text-xs", children: [_jsx("span", { children: "Progress" }), _jsxs("span", { children: [selectedNode.progress, "%"] })] }), _jsx("div", { className: "bg-muted h-2 w-full overflow-hidden rounded-full", children: _jsx("div", { className: cn('h-full rounded-full transition-all', featureNodeStateConfig[selectedNode.state].progressClass), style: { width: `${selectedNode.progress}%` } }) })] })) : null] }), _jsx(Separator, {}), _jsx(DetailsSection, { data: selectedNode })] })) : null }) }));
+}
+function StateBadge({ data }) {
+    const config = featureNodeStateConfig[data.state];
+    const Icon = config.icon;
+    return (_jsxs("div", { className: cn('flex items-center gap-2 rounded-full px-3 py-1.5 text-sm font-medium', config.badgeBgClass, config.badgeClass), children: [data.state === 'running' ? (_jsx(CometSpinner, { size: "sm", className: "shrink-0" })) : (_jsx(Icon, { className: "h-4 w-4 shrink-0" })), _jsx("span", { children: config.label })] }));
+}
+function DetailsSection({ data }) {
+    const hasAnyDetail = data.description ?? data.agentName ?? data.runtime ?? data.blockedBy ?? data.errorMessage;
+    if (!hasAnyDetail)
+        return null;
+    return (_jsxs("div", { "data-testid": "feature-drawer-details", className: "flex flex-col gap-3 p-4", children: [data.description ? _jsx(DetailRow, { label: "Description", value: data.description }) : null, data.agentName ? _jsx(DetailRow, { label: "Agent", value: data.agentName }) : null, data.runtime ? _jsx(DetailRow, { label: "Runtime", value: data.runtime }) : null, data.blockedBy ? _jsx(DetailRow, { label: "Blocked by", value: data.blockedBy }) : null, data.errorMessage ? _jsx(DetailRow, { label: "Error", value: data.errorMessage }) : null] }));
+}
+function DetailRow({ label, value }) {
+    return (_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: label }), _jsx("span", { className: "text-sm", children: value })] }));
+}

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

@@ -0,0 +1,19 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { FeatureDrawer } from './feature-drawer.js';
+declare const meta: Meta<typeof FeatureDrawer>;
+export default meta;
+type Story = StoryObj<typeof FeatureDrawer>;
+export declare const Running: Story;
+export declare const ActionRequired: Story;
+export declare const Done: Story;
+export declare const Blocked: Story;
+export declare const Error: Story;
+/** Minimal data — only required fields, no optional details section. */
+export declare const MinimalData: Story;
+/** All optional fields populated — description, agent, runtime, blockedBy, error. */
+export declare const AllFields: Story;
+/** Cycle through all 5 states at a glance via buttons. */
+export declare const AllStates: Story;
+/** Cycle through all 6 lifecycle phases via buttons. */
+export declare const AllLifecycles: Story;
+//# sourceMappingURL=feature-drawer.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"feature-drawer.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer/feature-drawer.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAOpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAoF5C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAEnB,CAAC;AAMF,wEAAwE;AACxE,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,qFAAqF;AACrF,eAAO,MAAM,SAAS,EAAE,KAmBvB,CAAC;AAuDF,0DAA0D;AAC1D,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AA2CF,wDAAwD;AACxD,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC"}

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

@@ -0,0 +1,167 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { FeatureDrawer } from './feature-drawer.js';
+import { Button } from '../../ui/button.js';
+const meta = {
+    title: 'Composed/FeatureDrawer',
+    component: FeatureDrawer,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'fullscreen',
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const baseData = {
+    name: 'Auth Module',
+    featureId: '#f1',
+    lifecycle: 'implementation',
+    state: 'running',
+    progress: 45,
+};
+const runningData = {
+    name: 'Auth Module',
+    description: 'Implement OAuth2 authentication flow',
+    featureId: '#f1',
+    lifecycle: 'implementation',
+    state: 'running',
+    progress: 45,
+    agentName: 'Planner',
+};
+const actionRequiredData = {
+    name: 'API Rate Limiting',
+    description: 'Implement sliding window rate limiting for public endpoints',
+    featureId: '#bi1',
+    lifecycle: 'requirements',
+    state: 'action-required',
+    progress: 22,
+};
+const doneData = {
+    name: 'Payment Gateway',
+    description: 'Stripe integration for subscriptions',
+    featureId: '#f3',
+    lifecycle: 'deploy',
+    state: 'done',
+    progress: 100,
+    runtime: '1h 42m',
+};
+const blockedData = {
+    name: 'Search Index',
+    description: 'Elasticsearch full-text search setup',
+    featureId: '#f4',
+    lifecycle: 'implementation',
+    state: 'blocked',
+    progress: 20,
+    blockedBy: 'Auth Module',
+};
+const errorData = {
+    name: 'Email Service',
+    description: 'Transactional email with SendGrid',
+    featureId: '#f5',
+    lifecycle: 'review',
+    state: 'error',
+    progress: 30,
+    errorMessage: 'Build failed: type mismatch',
+};
+/* ---------------------------------------------------------------------------
+ * Trigger wrapper — starts closed, click to open
+ * ------------------------------------------------------------------------- */
+function DrawerTrigger({ data, label }) {
+    const [selected, setSelected] = useState(null);
+    return (_jsxs("div", { className: "flex h-screen items-start p-4", children: [_jsx(Button, { variant: "outline", onClick: () => setSelected(data), children: label }), _jsx(FeatureDrawer, { selectedNode: selected, onClose: () => setSelected(null) })] }));
+}
+/* ---------------------------------------------------------------------------
+ * Per-state stories
+ * ------------------------------------------------------------------------- */
+export const Running = {
+    render: () => _jsx(DrawerTrigger, { data: runningData, label: "Open Running" }),
+};
+export const ActionRequired = {
+    render: () => _jsx(DrawerTrigger, { data: actionRequiredData, label: "Open Action Required" }),
+};
+export const Done = {
+    render: () => _jsx(DrawerTrigger, { data: doneData, label: "Open Done" }),
+};
+export const Blocked = {
+    render: () => _jsx(DrawerTrigger, { data: blockedData, label: "Open Blocked" }),
+};
+export const Error = {
+    render: () => _jsx(DrawerTrigger, { data: errorData, label: "Open Error" }),
+};
+/* ---------------------------------------------------------------------------
+ * Edge-case stories
+ * ------------------------------------------------------------------------- */
+/** Minimal data — only required fields, no optional details section. */
+export const MinimalData = {
+    render: () => _jsx(DrawerTrigger, { data: { ...baseData, progress: 0 }, label: "Open Minimal" }),
+};
+/** All optional fields populated — description, agent, runtime, blockedBy, error. */
+export const AllFields = {
+    render: () => (_jsx(DrawerTrigger, { data: {
+            name: 'Enterprise Authentication Module',
+            description: 'Implement a comprehensive OAuth2 authentication flow with support for multiple identity providers including Google, GitHub, and custom SAML-based enterprise SSO.',
+            featureId: '#f99',
+            lifecycle: 'implementation',
+            state: 'running',
+            progress: 68,
+            agentName: 'Implementer',
+            runtime: '3h 15m',
+            blockedBy: 'Database Migration',
+            errorMessage: 'Token refresh failed: invalid_grant',
+        }, label: "Open All Fields" })),
+};
+/* ---------------------------------------------------------------------------
+ * Matrix stories — interactive state/lifecycle switcher
+ * ------------------------------------------------------------------------- */
+const stateFixtures = {
+    running: runningData,
+    'action-required': actionRequiredData,
+    done: doneData,
+    blocked: blockedData,
+    error: errorData,
+};
+const allLifecycles = [
+    'requirements',
+    'research',
+    'implementation',
+    'review',
+    'deploy',
+    'maintain',
+];
+function AllStatesRender() {
+    const [state, setState] = useState('running');
+    const [selected, setSelected] = useState(null);
+    const _data = stateFixtures[state];
+    return (_jsxs("div", { className: "flex h-screen", children: [_jsxs("div", { className: "flex flex-col gap-2 p-4", children: [_jsx("span", { className: "text-muted-foreground mb-2 text-xs font-semibold tracking-wider uppercase", children: "Select state" }), Object.keys(stateFixtures).map((s) => (_jsx("button", { type: "button", onClick: () => {
+                            setState(s);
+                            setSelected(stateFixtures[s]);
+                        }, className: `rounded-md px-3 py-1.5 text-left text-sm ${s === state ? 'bg-primary text-primary-foreground' : 'bg-muted hover:bg-muted/80'}`, children: s }, s)))] }), _jsx(FeatureDrawer, { selectedNode: selected, onClose: () => setSelected(null) })] }));
+}
+/** Cycle through all 5 states at a glance via buttons. */
+export const AllStates = {
+    render: () => _jsx(AllStatesRender, {}),
+};
+function AllLifecyclesRender() {
+    const [lifecycle, setLifecycle] = useState('requirements');
+    const [selected, setSelected] = useState(null);
+    return (_jsxs("div", { className: "flex h-screen", children: [_jsxs("div", { className: "flex flex-col gap-2 p-4", children: [_jsx("span", { className: "text-muted-foreground mb-2 text-xs font-semibold tracking-wider uppercase", children: "Select phase" }), allLifecycles.map((phase) => (_jsx("button", { type: "button", onClick: () => {
+                            setLifecycle(phase);
+                            setSelected({
+                                name: 'Feature Name',
+                                description: `Currently in ${phase} phase`,
+                                featureId: '#f1',
+                                lifecycle: phase,
+                                state: 'running',
+                                progress: 50,
+                                agentName: 'Agent',
+                            });
+                        }, className: `rounded-md px-3 py-1.5 text-left text-sm ${phase === lifecycle
+                            ? 'bg-primary text-primary-foreground'
+                            : 'bg-muted hover:bg-muted/80'}`, children: phase }, phase)))] }), _jsx(FeatureDrawer, { selectedNode: selected, onClose: () => setSelected(null) })] }));
+}
+/** Cycle through all 6 lifecycle phases via buttons. */
+export const AllLifecycles = {
+    render: () => _jsx(AllLifecyclesRender, {}),
+};

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

@@ -0,0 +1,2 @@
+export { FeatureDrawer, type FeatureDrawerProps } from './feature-drawer.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,kBAAkB,CAAC"}

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

@@ -0,0 +1 @@
+export { FeatureDrawer } from './feature-drawer.js';

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

@@ -1,12 +1,9 @@
 import { type LucideIcon } from 'lucide-react';
 import type { Node } from '@xyflow/react';
-import type { AgentTypeValue } from './agent-type-icons.js';
 export type FeatureNodeState = 'running' | 'action-required' | 'done' | 'blocked' | 'error';
 export type FeatureLifecyclePhase = 'requirements' | 'research' | 'implementation' | 'review' | 'deploy' | 'maintain';
 /** Human-readable display labels for lifecycle phases. */
 export declare const lifecycleDisplayLabels: Record<FeatureLifecyclePhase, string>;
-/** Present-participle verbs for the running badge, keyed by lifecycle phase. */
-export declare const lifecycleRunningVerbs: Record<FeatureLifecyclePhase, string>;
 export interface FeatureNodeData {
     [key: string]: unknown;
     name: string;
@@ -21,8 +18,8 @@ export interface FeatureNodeData {
     blockedBy?: string;
     /** Short error message for error state */
     errorMessage?: string;
-    /** Agent executor type (e.g. "claude-code", "cursor"). */
-    agentType?: AgentTypeValue;
+    /** Agent name shown in the running badge (e.g. "Planner") */
+    agentName?: string;
     onAction?: () => void;
     onSettings?: () => void;
     showHandles?: boolean;

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":"AAAA,OAAO,EAAqD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAClG,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,iBAAiB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAE5F,MAAM,MAAM,qBAAqB,GAC7B,cAAc,GACd,UAAU,GACV,gBAAgB,GAChB,QAAQ,GACR,QAAQ,GACR,UAAU,CAAC;AAEf,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOxE,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOvE,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,qBAAqB,CAAC;IACjC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC;AAEnE,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,gBAAgB,EAAE,sBAAsB,CAmDnF,CAAC"}
+{"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":"AAAA,OAAO,EAAmD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAChG,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE1C,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,iBAAiB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAE5F,MAAM,MAAM,qBAAqB,GAC7B,cAAc,GACd,UAAU,GACV,gBAAgB,GAChB,QAAQ,GACR,QAAQ,GACR,UAAU,CAAC;AAEf,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOxE,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,qBAAqB,CAAC;IACjC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC;AAEnE,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,gBAAgB,EAAE,sBAAsB,CAmDnF,CAAC"}

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

@@ -1,4 +1,4 @@
-import { Loader2, AlertTriangle, CircleCheck, Ban, CircleX } from 'lucide-react';
+import { Loader2, CircleAlert, CircleCheck, Ban, CircleX } from 'lucide-react';
 /** Human-readable display labels for lifecycle phases. */
 export const lifecycleDisplayLabels = {
     requirements: 'REQUIREMENTS',
@@ -8,15 +8,6 @@ export const lifecycleDisplayLabels = {
     deploy: 'DEPLOY & QA',
     maintain: 'COMPLETED',
 };
-/** Present-participle verbs for the running badge, keyed by lifecycle phase. */
-export const lifecycleRunningVerbs = {
-    requirements: 'Analyzing',
-    research: 'Researching',
-    implementation: 'Implementing',
-    review: 'Reviewing',
-    deploy: 'Deploying',
-    maintain: 'Maintaining',
-};
 export const featureNodeStateConfig = {
     running: {
         icon: Loader2,
@@ -29,12 +20,12 @@ export const featureNodeStateConfig = {
         showProgressBar: false,
     },
     'action-required': {
-        icon: AlertTriangle,
+        icon: CircleAlert,
         borderClass: 'border-l-amber-500',
         labelClass: 'text-amber-500',
         progressClass: 'bg-amber-500',
-        badgeClass: 'text-amber-800',
-        badgeBgClass: 'bg-amber-50 border border-amber-200',
+        badgeClass: 'text-amber-700',
+        badgeBgClass: 'bg-amber-50',
         label: 'User action required',
         showProgressBar: false,
     },

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":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAwBnE,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,2CA6IA"}
+{"version":3,"file":"feature-node.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAoBnE,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,2CA0IA"}

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

@@ -3,17 +3,15 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { Handle, Position } from '@xyflow/react';
 import { Settings, Plus } from 'lucide-react';
 import { cn } from '../../../lib/utils.js';
-import { featureNodeStateConfig, lifecycleDisplayLabels, lifecycleRunningVerbs, } from './feature-node-state-config.js';
-import { getAgentTypeIcon } from './agent-type-icons.js';
-function AgentIcon({ agentType, className }) {
-    const IconComponent = getAgentTypeIcon(agentType);
-    return _jsx(IconComponent, { className: className });
-}
+import { CometSpinner } from '../../ui/comet-spinner.js';
+import { featureNodeStateConfig, lifecycleDisplayLabels } from './feature-node-state-config.js';
 function getBadgeText(data) {
     const config = featureNodeStateConfig[data.state];
     switch (data.state) {
-        case 'running':
-            return lifecycleRunningVerbs[data.lifecycle];
+        case 'running': {
+            const agent = data.agentName ?? 'Agent';
+            return `${agent} ${data.featureId} running`;
+        }
         case 'done':
             return data.runtime ? `Completed in ${data.runtime}` : 'Completed';
         case 'blocked':
@@ -30,7 +28,7 @@ export function FeatureNode({ data, selected, }) {
     return (_jsxs("div", { className: "group relative", children: [data.showHandles ? (_jsx(Handle, { type: "target", position: Position.Left, isConnectable: false, className: "opacity-0!" })) : null, _jsxs("div", { "data-testid": "feature-node-card", className: cn('bg-card flex min-h-35 w-72 flex-col rounded-lg border p-3 shadow-sm', selected && 'ring-primary ring-2'), 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: lifecycleDisplayLabels[data.lifecycle] }), data.onSettings ? (_jsx("button", { type: "button", "aria-label": "Settings", "data-testid": "feature-node-settings-button", onClick: (e) => {
                                     e.stopPropagation();
                                     data.onSettings?.();
-                                }, className: "nodrag text-muted-foreground hover:text-foreground -mt-1 -mr-1 p-1", children: _jsx(Settings, { className: "h-3.5 w-3.5" }) })) : 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 === '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("div", { "data-testid": "feature-node-badge", className: cn('mt-1.5 flex items-center justify-center gap-1.5 rounded-full px-2.5 py-1 text-[11px] font-medium', config.badgeBgClass, config.badgeClass), children: [_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "truncate", children: getBadgeText(data) })] })) })] }), data.onAction ? (_jsx(Handle, { type: "source", position: Position.Right, className: "h-0! w-0! border-0! bg-transparent!", children: _jsx("button", { type: "button", "aria-label": "Add", "data-testid": "feature-node-action-button", onClick: (e) => {
+                                }, className: "nodrag text-muted-foreground hover:text-foreground -mt-1 -mr-1 p-1", children: _jsx(Settings, { className: "h-3.5 w-3.5" }) })) : 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: config.showProgressBar ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "text-muted-foreground flex items-center justify-between text-[10px]", children: [_jsx("span", { children: data.featureId }), _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: [_jsx("div", { className: "text-muted-foreground text-[10px]", children: _jsx("span", { children: data.featureId }) }), _jsxs("div", { "data-testid": "feature-node-badge", className: cn('mt-1.5 flex items-center justify-center gap-1.5 rounded-full px-2.5 py-1 text-[11px] font-medium', config.badgeBgClass, config.badgeClass), children: [data.state === 'running' ? (_jsx(CometSpinner, { size: "sm", className: "shrink-0" })) : (_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0" })), _jsx("span", { className: "truncate", children: getBadgeText(data) })] })] })) })] }), data.onAction ? (_jsx(Handle, { type: "source", position: Position.Right, className: "h-0! w-0! border-0! bg-transparent!", 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!" })) : null] }));

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

@@ -11,6 +11,5 @@ export declare const LongContent: Story;
 export declare const DoneWithRuntime: Story;
 export declare const BlockedByFeature: Story;
 export declare const ErrorWithMessage: Story;
-export declare const AllAgentTypes: Story;
 export declare const Interactive: Story;
 //# sourceMappingURL=feature-node.stories.d.ts.map

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;AAIvD,OAAO,KAAK,EACV,eAAe,EAIhB,MAAM,6BAA6B,CAAC;AAkCrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,eAAe,CAe/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAiDF,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC;AAWF,eAAO,MAAM,aAAa,EAAE,KAoB3B,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,gBAAgB,EAAE,KAW9B,CAAC;AAWF,eAAO,MAAM,aAAa,EAAE,KAoB3B,CAAC;AAuEF,eAAO,MAAM,WAAW,EAAE,KAOzB,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;AAIvD,OAAO,KAAK,EACV,eAAe,EAIhB,MAAM,6BAA6B,CAAC;AAiCrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,eAAe,CAe/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAiDF,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC;AAWF,eAAO,MAAM,aAAa,EAAE,KAoB3B,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,gBAAgB,EAAE,KAW9B,CAAC;AAuEF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC"}

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

@@ -22,7 +22,7 @@ const meta = {
         lifecycle: 'requirements',
         state: 'running',
         progress: 45,
-        agentType: 'claude-code',
+        agentName: 'Planner',
     },
 };
 export default meta;
@@ -37,7 +37,7 @@ const allStatesData = [
         lifecycle: 'implementation',
         state: 'running',
         progress: 45,
-        agentType: 'claude-code',
+        agentName: 'Planner',
     },
     {
         name: 'API Rate Limiting',
@@ -94,7 +94,7 @@ export const AllLifecycles = {
                 lifecycle,
                 state: 'running',
                 progress: [10, 25, 50, 70, 90, 100][i],
-                agentType: 'claude-code',
+                agentName: 'Researcher',
             } }, lifecycle))) })),
 };
 export const WithAction = {
@@ -147,25 +147,6 @@ export const ErrorWithMessage = {
     },
     render: (args) => _jsx(FeatureNodeCanvas, { data: args }),
 };
-const allAgentTypes = [
-    'claude-code',
-    'cursor',
-    'gemini-cli',
-    'aider',
-    'continue',
-    undefined,
-];
-export const AllAgentTypes = {
-    render: () => (_jsx("div", { className: "flex flex-wrap gap-6", children: allAgentTypes.map((agentType, i) => (_jsx(FeatureNodeCanvas, { style: { width: 500, height: 350 }, data: {
-                name: agentType ?? 'Unknown Agent',
-                description: agentType ? `Running with ${agentType}` : 'Fallback icon',
-                featureId: `#f${i + 1}`,
-                lifecycle: 'implementation',
-                state: 'running',
-                progress: 45,
-                agentType,
-            } }, agentType ?? 'fallback'))) })),
-};
 const interactiveInitialNodes = [
     {
         id: 'node-1',
@@ -179,7 +160,7 @@ const interactiveInitialNodes = [
             lifecycle: 'implementation',
             state: 'running',
             progress: 45,
-            agentType: 'claude-code',
+            agentName: 'Planner',
         },
     },
     {

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

@@ -1,5 +1,3 @@
 export { FeatureNode } from './feature-node.js';
-export { featureNodeStateConfig, lifecycleDisplayLabels, lifecycleRunningVerbs, type FeatureNodeState, type FeatureLifecyclePhase, type FeatureNodeData, type FeatureNodeType, type FeatureNodeStateConfig, } from './feature-node-state-config.js';
-export { getAgentTypeIcon, type AgentTypeValue } from './agent-type-icons.js';
-export { deriveNodeState, deriveProgress } from './derive-feature-state.js';
+export { featureNodeStateConfig, lifecycleDisplayLabels, type FeatureNodeState, type FeatureLifecyclePhase, type FeatureNodeData, type FeatureNodeType, type FeatureNodeStateConfig, } from './feature-node-state-config.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EACL,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,EACrB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,KAAK,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC3E,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EACL,sBAAsB,EACtB,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,6BAA6B,CAAC"}

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

@@ -1,4 +1,2 @@
 export { FeatureNode } from './feature-node.js';
-export { featureNodeStateConfig, lifecycleDisplayLabels, lifecycleRunningVerbs, } from './feature-node-state-config.js';
-export { getAgentTypeIcon } from './agent-type-icons.js';
-export { deriveNodeState, deriveProgress } from './derive-feature-state.js';
+export { featureNodeStateConfig, lifecycleDisplayLabels, } from './feature-node-state-config.js';

package/dist/src/presentation/web/components/common/index.d.ts

@@ -1,6 +1,8 @@
 export { AddRepositoryNode, type AddRepositoryNodeData, type AddRepositoryNodeType, } from './add-repository-node/index.js';
 export { ElapsedTime, formatElapsed } from './elapsed-time/index.js';
 export { EmptyState, type EmptyStateProps } from './empty-state/index.js';
+export { FeatureCreateDrawer, type FeatureCreateDrawerProps, type CreateFeatureFormData, } from './feature-create-drawer/index.js';
+export { FeatureDrawer, type FeatureDrawerProps } from './feature-drawer/index.js';
 export { FeatureListItem, type FeatureListItemProps } from './feature-list-item/index.js';
 export { FeatureNode, featureNodeStateConfig, type FeatureNodeState, type FeatureLifecyclePhase, type FeatureNodeData, type FeatureNodeType, type FeatureNodeStateConfig, } from './feature-node/index.js';
 export { FeatureStatusBadges, type FeatureStatusBadgesProps } from './feature-status-badges/index.js';

package/dist/src/presentation/web/components/common/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/common/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,qBAAqB,EAC1B,KAAK,qBAAqB,GAC3B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,WAAW,EACX,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/common/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,qBAAqB,EAC1B,KAAK,qBAAqB,GAC3B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,qBAAqB,GAC3B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,WAAW,EACX,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/src/presentation/web/components/common/index.js

@@ -1,6 +1,8 @@
 export { AddRepositoryNode, } from './add-repository-node/index.js';
 export { ElapsedTime, formatElapsed } from './elapsed-time/index.js';
 export { EmptyState } from './empty-state/index.js';
+export { FeatureCreateDrawer, } from './feature-create-drawer/index.js';
+export { FeatureDrawer } from './feature-drawer/index.js';
 export { FeatureListItem } from './feature-list-item/index.js';
 export { FeatureNode, featureNodeStateConfig, } from './feature-node/index.js';
 export { FeatureStatusBadges } from './feature-status-badges/index.js';

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

@@ -1 +1 @@
-{"version":3,"file":"control-center-inner.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-inner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAI5E,UAAU,uBAAuB;IAC/B,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,YAAY,EAAE,IAAI,EAAE,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,YAAY,EAAE,EAAE,uBAAuB,2CA6BzF"}
+{"version":3,"file":"control-center-inner.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-inner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAK5E,UAAU,uBAAuB;IAC/B,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,YAAY,EAAE,IAAI,EAAE,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,YAAY,EAAE,EAAE,uBAAuB,2CAgDzF"}

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

@@ -1,9 +1,17 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
 import { FeaturesCanvas } from '../../features/features-canvas/index.js';
+import { FeatureDrawer, FeatureCreateDrawer } from '../../common/index.js';
 import { ControlCenterEmptyState } from './control-center-empty-state.js';
 import { useControlCenterState } from './use-control-center-state.js';
 export function ControlCenterInner({ initialNodes, initialEdges }) {
-    const { nodes, edges, onNodesChange, handleConnect, handleAddFeature, handleAddFeatureToRepo, handleAddFeatureToFeature, handleAddRepository, handleNodeClick, clearSelection, } = useControlCenterState(initialNodes, initialEdges);
-    return (_jsx(FeaturesCanvas, { nodes: nodes, edges: edges, onNodesChange: onNodesChange, onConnect: handleConnect, onAddFeature: handleAddFeature, onNodeAction: handleAddFeatureToFeature, onNodeClick: handleNodeClick, onPaneClick: clearSelection, onRepositoryAdd: handleAddFeatureToRepo, onRepositorySelect: handleAddRepository, emptyState: _jsx(ControlCenterEmptyState, { onRepositorySelect: handleAddRepository }) }));
+    const { nodes, edges, selectedNode, isCreateDrawerOpen, onNodesChange, handleConnect, handleAddFeature, handleAddFeatureToRepo, handleAddFeatureToFeature, handleAddRepository, handleNodeClick, clearSelection, handleCreateFeatureSubmit, closeCreateDrawer, } = useControlCenterState(initialNodes, initialEdges);
+    // Listen for global "open create drawer" events from the sidebar
+    useEffect(() => {
+        const handler = () => handleAddFeature();
+        window.addEventListener('shep:open-create-drawer', handler);
+        return () => window.removeEventListener('shep:open-create-drawer', handler);
+    }, [handleAddFeature]);
+    return (_jsxs(_Fragment, { children: [_jsx(FeaturesCanvas, { nodes: nodes, edges: edges, onNodesChange: onNodesChange, onConnect: handleConnect, onAddFeature: handleAddFeature, onNodeAction: handleAddFeatureToFeature, onNodeClick: handleNodeClick, onPaneClick: clearSelection, onRepositoryAdd: handleAddFeatureToRepo, onRepositorySelect: handleAddRepository, emptyState: _jsx(ControlCenterEmptyState, { onRepositorySelect: handleAddRepository }) }), _jsx(FeatureDrawer, { selectedNode: selectedNode, onClose: clearSelection }), _jsx(FeatureCreateDrawer, { open: isCreateDrawerOpen, onClose: closeCreateDrawer, onSubmit: handleCreateFeatureSubmit })] }));
 }

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

@@ -1,11 +1,13 @@
 import type { Connection, Edge, NodeChange } from '@xyflow/react';
 import type { FeatureNodeData } from '../../common/feature-node/index.js';
+import type { CreateFeatureFormData } from '../../common/feature-create-drawer/index.js';
 import type { CanvasNodeType } from '../../features/features-canvas/index.js';
 import { type LayoutDirection } from '../../../lib/layout-with-dagre.js';
 export interface ControlCenterState {
     nodes: CanvasNodeType[];
     edges: Edge[];
     selectedNode: FeatureNodeData | null;
+    isCreateDrawerOpen: boolean;
     onNodesChange: (changes: NodeChange<CanvasNodeType>[]) => void;
     handleConnect: (connection: Connection) => void;
     clearSelection: () => void;
@@ -15,6 +17,8 @@ export interface ControlCenterState {
     handleAddFeatureToFeature: (featureNodeId: string) => void;
     handleAddRepository: (path: string) => void;
     handleLayout: (direction: LayoutDirection) => void;
+    handleCreateFeatureSubmit: (data: CreateFeatureFormData) => void;
+    closeCreateDrawer: () => void;
 }
 export declare function useControlCenterState(initialNodes: CanvasNodeType[], initialEdges: Edge[]): ControlCenterState;
 //# sourceMappingURL=use-control-center-state.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"use-control-center-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/use-control-center-state.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAEhF,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,EAAE,eAAe,GAAG,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAC/D,aAAa,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAChD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;CACpD;AAID,wBAAgB,qBAAqB,CACnC,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,GACnB,kBAAkB,CA6PpB"}
+{"version":3,"file":"use-control-center-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/use-control-center-state.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2CAA2C,CAAC;AACvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAEhF,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,EAAE,eAAe,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAC/D,aAAa,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAChD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,yBAAyB,EAAE,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjE,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAID,wBAAgB,qBAAqB,CACnC,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,GACnB,kBAAkB,CAkRpB"}