@shepai/cli 1.73.1 → 1.74.0-pr226.8985ba7

package/dist/src/presentation/web/app/actions/create-feature.d.ts

@@ -4,8 +4,7 @@ interface Attachment {
     name: string;
 }
 interface CreateFeatureInput {
-    name: string;
-    description?: string;
+    description: string;
     repositoryPath: string;
     attachments?: Attachment[];
     approvalGates?: {

package/dist/src/presentation/web/app/actions/create-feature.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-feature.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/create-feature.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AAEpE,UAAU,UAAU;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAQD,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE;QACd,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAqBD,wBAAsB,aAAa,CACjC,KAAK,EAAE,kBAAkB,GACxB,OAAO,CAAC;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CA2DhD"}
+{"version":3,"file":"create-feature.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/create-feature.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AAEpE,UAAU,UAAU;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAQD,UAAU,kBAAkB;IAC1B,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE;QACd,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAaD,wBAAsB,aAAa,CACjC,KAAK,EAAE,kBAAkB,GACxB,OAAO,CAAC;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAyDhD"}

package/dist/src/presentation/web/app/actions/create-feature.js

@@ -1,10 +1,7 @@
 'use server';
 import { resolve } from '../../lib/server-container.js';
-function composeUserInput(name, description, attachments) {
-    let userInput = `Feature: ${name}`;
-    if (description) {
-        userInput += `\n\n${description}`;
-    }
+function composeUserInput(description, attachments) {
+    let userInput = description;
     if (attachments && attachments.length > 0) {
         const paths = attachments.map((a) => `- ${a.path}`).join('\n');
         userInput += `\n\nAttached files:\n${paths}`;
@@ -12,14 +9,14 @@ function composeUserInput(name, description, attachments) {
     return userInput;
 }
 export async function createFeature(input) {
-    const { name, description, repositoryPath, attachments, approvalGates, push, openPr, parentId } = input;
-    if (!name?.trim()) {
-        return { error: 'name is required' };
+    const { description, repositoryPath, attachments, approvalGates, push, openPr, parentId } = input;
+    if (!description?.trim()) {
+        return { error: 'description is required' };
     }
     if (!repositoryPath?.trim()) {
         return { error: 'repositoryPath is required' };
     }
-    const userInput = composeUserInput(name, description, attachments);
+    const userInput = composeUserInput(description, attachments);
     const gates = {
         allowPrd: approvalGates?.allowPrd ?? false,
         allowPlan: approvalGates?.allowPlan ?? false,
@@ -35,7 +32,6 @@ export async function createFeature(input) {
             push: push ?? false,
             openPr: openPr ?? false,
             ...(parentId ? { parentId } : {}),
-            name,
             description,
         });
         // Phase 2 (background): metadata generation, worktree, spec, agent spawn

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

@@ -7,8 +7,7 @@ export interface ParentFeatureOption {
     name: string;
 }
 export interface FeatureCreatePayload {
-    name: string;
-    description?: string;
+    description: string;
     attachments: FileAttachment[];
     repositoryPath: string;
     approvalGates: {

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

@@ -1 +1 @@
-{"version":3,"file":"feature-create-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAC/F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AAG5E,YAAY,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAE/F,0DAA0D;AAC1D,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE;QACb,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,EAAE,OAAO,CAAC;KACrB,CAAC;IACF,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAcD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,kGAAkG;IAClG,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,cAAc,EACd,YAAoB,EACpB,gBAAgB,EAChB,QAAQ,EACR,eAAe,GAChB,EAAE,wBAAwB,2CA8Q1B"}
+{"version":3,"file":"feature-create-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAC/F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AAG5E,YAAY,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAE/F,0DAA0D;AAC1D,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE;QACb,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,EAAE,OAAO,CAAC;KACrB,CAAC;IACF,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAcD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,kGAAkG;IAClG,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,cAAc,EACd,YAAoB,EACpB,gBAAgB,EAChB,QAAQ,EACR,eAAe,GAChB,EAAE,wBAAwB,2CA4P1B"}

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

@@ -31,7 +31,6 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
     const defaultGates = workflowDefaults?.approvalGates ?? EMPTY_GATES;
     const defaultPush = workflowDefaults?.push ?? false;
     const defaultOpenPr = workflowDefaults?.openPr ?? false;
-    const [name, setName] = useState('');
     const [description, setDescription] = useState('');
     const [attachments, setAttachments] = useState([]);
     const [approvalGates, setApprovalGates] = useState({ ...defaultGates });
@@ -53,7 +52,6 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         }
     }, [open, initialParentId]);
     const resetForm = useCallback(() => {
-        setName('');
         setDescription('');
         setAttachments([]);
         setApprovalGates({ ...defaultGates });
@@ -62,18 +60,16 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         setParentId(undefined);
     }, [defaultGates, defaultPush, defaultOpenPr]);
     // Track whether the form has unsaved data
-    const isDirty = name.trim() !== '' || description.trim() !== '' || attachments.length > 0;
+    const isDirty = description.trim() !== '' || attachments.length > 0;
     // Shared close guard — shows confirmation when dirty, prevents navigation
     const { attemptClose } = useGuardedDrawerClose({ open, isDirty, onClose, onReset: resetForm });
     const handleSubmit = useCallback((e) => {
         e.preventDefault();
-        if (!name.trim())
+        if (!description.trim())
             return;
         createSound.play();
-        const trimmedDescription = description.trim() || undefined;
         onSubmit({
-            name: name.trim(),
-            description: trimmedDescription,
+            description: description.trim(),
             attachments,
             repositoryPath,
             approvalGates: {
@@ -87,7 +83,6 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         });
         resetForm();
     }, [
-        name,
         description,
         attachments,
         approvalGates,
@@ -114,7 +109,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
         setAttachments((prev) => prev.filter((f) => f.path !== path));
     }, []);
     const hasFeatures = features && features.length > 0;
-    return (_jsx(BaseDrawer, { open: open, onClose: attemptClose, size: "md", modal: false, dismissOnOutsideClick: true, "data-testid": "feature-create-drawer", header: _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "h-2.5 w-2.5 shrink-0 rounded-full bg-blue-500" }), _jsx(DrawerTitle, { children: "NEW FEATURE" })] }), isSubmitting ? (_jsx(DrawerDescription, { asChild: true, children: _jsx("div", { children: _jsx(Badge, { variant: "secondary", children: "Creating..." }) }) })) : null] }), footer: _jsxs("div", { className: "flex flex-row justify-end gap-2", children: [_jsx(Button, { variant: "outline", onClick: attemptClose, disabled: isSubmitting, children: "Cancel" }), _jsx(Button, { type: "submit", form: "create-feature-form", disabled: !name.trim() || isSubmitting, children: isSubmitting ? 'Creating...' : '+ Create Feature' })] }), children: _jsx("div", { className: "overflow-y-auto p-4", children: _jsxs("form", { id: "create-feature-form", onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "feature-name", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "FEATURE NAME" }), _jsx(Input, { id: "feature-name", placeholder: "e.g. GitHub OAuth Login", value: name, onChange: (e) => setName(e.target.value), required: true, disabled: isSubmitting })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "feature-description", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "DESCRIPTION" }), _jsx(Textarea, { id: "feature-description", placeholder: "Describe what this feature does...", value: description, onChange: (e) => setDescription(e.target.value), rows: 4, disabled: isSubmitting })] }), hasFeatures ? (_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: "PARENT FEATURE" }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "APPROVE" }), _jsx(CheckboxGroup, { label: "Autonomous Mode", description: "YOLO!", parentAriaLabel: "Auto approve all", options: AUTO_APPROVE_OPTIONS, value: approvalGates, onValueChange: setApprovalGates, disabled: isSubmitting })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "GIT" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(CheckboxGroupItem, { id: "push", label: "Push", description: "Push branch to remote after implementation.", checked: push || openPr, onCheckedChange: setPush, disabled: openPr || isSubmitting }), _jsx(CheckboxGroupItem, { id: "open-pr", label: "Create PR", description: "Open a pull request after pushing.", checked: openPr, onCheckedChange: setOpenPr, disabled: isSubmitting })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: ["ATTACHMENTS", attachments.length > 0 && (_jsxs("span", { className: "text-muted-foreground/60 ml-1.5", children: ["(", attachments.length, ")"] }))] }), _jsxs(Button, { type: "button", variant: "outline", size: "xs", onClick: handleAddFiles, disabled: isSubmitting, children: [_jsx(PlusIcon, { className: "size-3" }), "Add Files"] })] }), attachments.length > 0 && (_jsx("div", { className: "flex flex-col gap-2", children: attachments.map((file) => (_jsx(AttachmentCard, { file: file, onRemove: () => handleRemoveFile(file.path), disabled: isSubmitting }, file.path))) }))] })] }) }) }));
+    return (_jsx(BaseDrawer, { open: open, onClose: attemptClose, size: "md", modal: false, dismissOnOutsideClick: true, "data-testid": "feature-create-drawer", header: _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "h-2.5 w-2.5 shrink-0 rounded-full bg-blue-500" }), _jsx(DrawerTitle, { children: "NEW FEATURE" })] }), isSubmitting ? (_jsx(DrawerDescription, { asChild: true, children: _jsx("div", { children: _jsx(Badge, { variant: "secondary", children: "Creating..." }) }) })) : null] }), footer: _jsxs("div", { className: "flex flex-row justify-end gap-2", children: [_jsx(Button, { variant: "outline", onClick: attemptClose, disabled: isSubmitting, children: "Cancel" }), _jsx(Button, { type: "submit", form: "create-feature-form", disabled: !description.trim() || isSubmitting, children: isSubmitting ? 'Creating...' : '+ Create Feature' })] }), children: _jsx("div", { className: "overflow-y-auto p-4", children: _jsxs("form", { id: "create-feature-form", onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "feature-description", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "DESCRIBE YOUR FEATURE" }), _jsx(Textarea, { id: "feature-description", placeholder: "e.g. Add GitHub OAuth login with callback handling and token refresh...", value: description, onChange: (e) => setDescription(e.target.value), rows: 4, required: true, disabled: isSubmitting })] }), hasFeatures ? (_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: "PARENT FEATURE" }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "APPROVE" }), _jsx(CheckboxGroup, { label: "Autonomous Mode", description: "YOLO!", parentAriaLabel: "Auto approve all", options: AUTO_APPROVE_OPTIONS, value: approvalGates, onValueChange: setApprovalGates, disabled: isSubmitting })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "GIT" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(CheckboxGroupItem, { id: "push", label: "Push", description: "Push branch to remote after implementation.", checked: push || openPr, onCheckedChange: setPush, disabled: openPr || isSubmitting }), _jsx(CheckboxGroupItem, { id: "open-pr", label: "Create PR", description: "Open a pull request after pushing.", checked: openPr, onCheckedChange: setOpenPr, disabled: isSubmitting })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs(Label, { className: "text-muted-foreground text-xs font-semibold tracking-wider", children: ["ATTACHMENTS", attachments.length > 0 && (_jsxs("span", { className: "text-muted-foreground/60 ml-1.5", children: ["(", attachments.length, ")"] }))] }), _jsxs(Button, { type: "button", variant: "outline", size: "xs", onClick: handleAddFiles, disabled: isSubmitting, children: [_jsx(PlusIcon, { className: "size-3" }), "Add Files"] })] }), attachments.length > 0 && (_jsx("div", { className: "flex flex-col gap-2", children: attachments.map((file) => (_jsx(AttachmentCard, { file: file, onRemove: () => handleRemoveFile(file.path), disabled: isSubmitting }, file.path))) }))] })] }) }) }));
 }
 function ParentFeatureCombobox({ features, value, onChange, disabled, }) {
     const [open, setOpen] = useState(false);

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

@@ -5,8 +5,7 @@ import { FeatureCreateDrawer } from './feature-create-drawer.js';
  * create a new feature in the Control Center.
  *
  * ### Form sections
- * - **Feature Name** (required) — text input, submit is disabled when empty
- * - **Description** (optional) — multi-line textarea
+ * - **Description** (required) — multi-line textarea, submit is disabled when empty
  * - **Auto Approve** — Tri-state parent checkbox with 3 child checkboxes (PRD, Plan, Merge).
  *   Parent shows indeterminate when some children are selected, checks/unchecks all on click.
  * - **Attachments** (optional) — native OS file picker with extension-based icon system:
@@ -18,12 +17,12 @@ import { FeatureCreateDrawer } from './feature-create-drawer.js';
  * |------|------|-------------|
  * | `open` | `boolean` | Controls drawer visibility |
  * | `onClose` | `() => void` | Called on dismiss (close button, cancel, or backdrop) |
- * | `onSubmit` | `(data: FeatureCreatePayload) => void` | Called with `{ name, description, attachments, repositoryPath, approvalGates }` |
+ * | `onSubmit` | `(data: FeatureCreatePayload) => void` | Called with `{ description, attachments, repositoryPath, approvalGates }` |
  * | `repositoryPath` | `string` | Repository path (mandatory) included in the submitted data |
  *
  * ### Behavior
- * - Form resets (name, description, attachments, checkboxes) when the drawer closes
- * - Submit button is disabled when name is empty
+ * - Form resets (description, attachments, checkboxes) when the drawer closes
+ * - Submit button is disabled when description is empty
  * - `approvalGates` always included: `{ allowPrd, allowPlan, allowMerge }` (all false by default)
  * - Non-modal (`modal={false}`) — canvas stays interactive behind the drawer
  * - Fixed width: 448px (`w-xl`) — matches review drawers (PRD, Plan, Merge)
@@ -36,13 +35,13 @@ type Story = StoryObj<typeof FeatureCreateDrawer>;
 /** Default empty form — click the trigger button to open the create feature drawer. */
 export declare const Default: Story;
 /**
- * Pre-filled form — click to open, then name and description are typed in.
+ * Pre-filled form — click to open, then description is typed in.
  * Demonstrates the form in a "ready to submit" state.
  */
 export declare const PreFilled: Story;
 /**
- * Validation state — open the drawer with an empty name field.
- * The "+ Create Feature" button is disabled because name validation fails.
+ * Validation state — open the drawer with an empty description field.
+ * The "+ Create Feature" button is disabled because description validation fails.
  */
 export declare const ValidationDisabled: Story;
 /** Click to open the drawer for quick visual inspection. */

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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;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;AAiDlD,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;AAYF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAWlC,CAAC;AAgDF,+EAA+E;AAC/E,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAcjC,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,KAsCzB,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;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;AAiDlD,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;AAYF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAWlC,CAAC;AAgDF,+EAA+E;AAC/E,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAMF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAgBjC,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,KAsCzB,CAAC"}

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

@@ -12,8 +12,7 @@ import { DrawerCloseGuardProvider } from '../../../hooks/drawer-close-guard.js';
  * create a new feature in the Control Center.
  *
  * ### Form sections
- * - **Feature Name** (required) — text input, submit is disabled when empty
- * - **Description** (optional) — multi-line textarea
+ * - **Description** (required) — multi-line textarea, submit is disabled when empty
  * - **Auto Approve** — Tri-state parent checkbox with 3 child checkboxes (PRD, Plan, Merge).
  *   Parent shows indeterminate when some children are selected, checks/unchecks all on click.
  * - **Attachments** (optional) — native OS file picker with extension-based icon system:
@@ -25,12 +24,12 @@ import { DrawerCloseGuardProvider } from '../../../hooks/drawer-close-guard.js';
  * |------|------|-------------|
  * | `open` | `boolean` | Controls drawer visibility |
  * | `onClose` | `() => void` | Called on dismiss (close button, cancel, or backdrop) |
- * | `onSubmit` | `(data: FeatureCreatePayload) => void` | Called with `{ name, description, attachments, repositoryPath, approvalGates }` |
+ * | `onSubmit` | `(data: FeatureCreatePayload) => void` | Called with `{ description, attachments, repositoryPath, approvalGates }` |
  * | `repositoryPath` | `string` | Repository path (mandatory) included in the submitted data |
  *
  * ### Behavior
- * - Form resets (name, description, attachments, checkboxes) when the drawer closes
- * - Submit button is disabled when name is empty
+ * - Form resets (description, attachments, checkboxes) when the drawer closes
+ * - Submit button is disabled when description is empty
  * - `approvalGates` always included: `{ allowPrd, allowPlan, allowMerge }` (all false by default)
  * - Non-modal (`modal={false}`) — canvas stays interactive behind the drawer
  * - Fixed width: 448px (`w-xl`) — matches review drawers (PRD, Plan, Merge)
@@ -56,7 +55,7 @@ const meta = {
             description: 'Callback fired when the drawer is dismissed (close button, cancel, or backdrop click).',
         },
         onSubmit: {
-            description: 'Callback fired with `FeatureCreatePayload` when the form is submitted. Receives `{ name, description, attachments, repositoryPath, approvalGates }`.',
+            description: 'Callback fired with `FeatureCreatePayload` when the form is submitted. Receives `{ description, attachments, repositoryPath, approvalGates }`.',
         },
         repositoryPath: {
             control: 'text',
@@ -92,7 +91,7 @@ export const Default = {
     render: () => _jsx(CreateDrawerTrigger, {}),
 };
 /**
- * Pre-filled form — click to open, then name and description are typed in.
+ * Pre-filled form — click to open, then description is typed in.
  * Demonstrates the form in a "ready to submit" state.
  */
 export const PreFilled = {
@@ -102,15 +101,13 @@ export const PreFilled = {
         await userEvent.click(canvas.getByRole('button', { name: 'Open Pre-Filled' }));
         // Drawer renders in a portal — query from document body
         const body = within(canvasElement.ownerDocument.body);
-        const nameInput = await body.findByPlaceholderText('e.g. GitHub OAuth Login');
-        const descInput = body.getByPlaceholderText('Describe what this feature does...');
-        await userEvent.type(nameInput, 'GitHub OAuth Login');
+        const descInput = await body.findByPlaceholderText('e.g. Add GitHub OAuth login with callback handling and token refresh...');
         await userEvent.type(descInput, 'Implement OAuth2 authentication with GitHub as the identity provider. Includes login, callback handling, and token refresh.');
     },
 };
 /**
- * Validation state — open the drawer with an empty name field.
- * The "+ Create Feature" button is disabled because name validation fails.
+ * Validation state — open the drawer with an empty description field.
+ * The "+ Create Feature" button is disabled because description validation fails.
  */
 export const ValidationDisabled = {
     render: () => _jsx(CreateDrawerTrigger, { label: "Open Validation Demo" }),
@@ -243,7 +240,7 @@ export const WithWorkflowDefaults = {
  * and click "Add Files" to attach files via the native OS file picker.
  *
  * **Submitted data** is displayed in a styled panel showing `FeatureCreatePayload`
- * with `{ name, description, attachments, repositoryPath, approvalGates }`.
+ * with `{ description, attachments, repositoryPath, approvalGates }`.
  *
  * In Storybook, the native picker won't work (no backend), but submitted data
  * would show the paths if files were attached programmatically.
@@ -278,8 +275,8 @@ export const DiscardConfirmation = {
         const canvas = within(canvasElement);
         await userEvent.click(canvas.getByRole('button', { name: 'Open (Discard Confirmation)' }));
         const body = within(canvasElement.ownerDocument.body);
-        const nameInput = await body.findByPlaceholderText('e.g. GitHub OAuth Login');
-        await userEvent.type(nameInput, 'My Feature');
+        const descInput = await body.findByPlaceholderText('e.g. Add GitHub OAuth login with callback handling and token refresh...');
+        await userEvent.type(descInput, 'My Feature');
         // Click Cancel — should show the discard confirmation dialog
         const cancelButton = body.getByRole('button', { name: 'Cancel' });
         await userEvent.click(cancelButton);

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":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAa5E,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,2CAoOzF"}
+{"version":3,"file":"control-center-inner.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/control-center-inner.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAY,MAAM,eAAe,CAAC;AAEpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAc5E,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,2CAoPzF"}

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

@@ -7,6 +7,7 @@ import { useSidebarFeaturesContext, mapNodeStateToSidebarStatus, } from '../../.
 import { useSelectedFeatureId } from '../../../hooks/use-selected-feature-id.js';
 import { useSoundAction } from '../../../hooks/use-sound-action.js';
 import { useDrawerCloseGuard } from '../../../hooks/drawer-close-guard.js';
+import { useViewportPersistence } from '../../../hooks/use-viewport-persistence.js';
 import { ControlCenterEmptyState } from './control-center-empty-state.js';
 import { useControlCenterState } from './use-control-center-state.js';
 export function ControlCenterInner({ initialNodes, initialEdges }) {
@@ -15,6 +16,7 @@ export function ControlCenterInner({ initialNodes, initialEdges }) {
     const selectedFeatureId = useSelectedFeatureId();
     const clickSound = useSoundAction('click');
     const { guardedNavigate } = useDrawerCloseGuard();
+    const { defaultViewport, onMoveEnd: handleViewportChange, resetViewport, } = useViewportPersistence();
     const { nodes, edges, onNodesChange, handleConnect, handleAddRepository, handleDeleteFeature, handleDeleteRepository, createFeatureNode, setCallbacks, } = useControlCenterState(initialNodes, initialEdges);
     // Publish sidebar features to context whenever feature node data changes
     const { setFeatures: setSidebarFeatures } = useSidebarFeaturesContext();
@@ -158,9 +160,12 @@ export function ControlCenterInner({ initialNodes, initialEdges }) {
         handleRepositoryClick,
         handleDeleteRepository,
     ]);
+    const handleMoveEnd = useCallback((_event, viewport) => {
+        handleViewportChange(viewport);
+    }, [handleViewportChange]);
     const hasRepositories = nodes.some((n) => n.type === 'repositoryNode');
     if (!hasRepositories) {
         return _jsx(ControlCenterEmptyState, { onRepositorySelect: handleAddRepository });
     }
-    return (_jsx(FeaturesCanvas, { nodes: nodes, edges: edges, selectedFeatureId: selectedFeatureId, onNodesChange: onNodesChange, onConnect: handleConnect, onAddFeature: handleAddFeature, onNodeClick: handleNodeClick, onPaneClick: handleClearDrawers, emptyState: _jsx(ControlCenterEmptyState, { onRepositorySelect: handleAddRepository }) }));
+    return (_jsx(FeaturesCanvas, { nodes: nodes, edges: edges, selectedFeatureId: selectedFeatureId, defaultViewport: defaultViewport, onNodesChange: onNodesChange, onConnect: handleConnect, onAddFeature: handleAddFeature, onNodeClick: handleNodeClick, onPaneClick: handleClearDrawers, onMoveEnd: handleMoveEnd, onResetViewport: resetViewport, emptyState: _jsx(ControlCenterEmptyState, { onRepositorySelect: handleAddRepository }) }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"dependency-edge.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/dependency-edge.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMvD,OAAO,8BAA8B,CAAC;AAEtC,QAAA,MAAM,IAAI,EAAE,IAWX,CAAC;AAEF,eAAe,IAAI,CAAC;AA2BpB,eAAO,MAAM,OAAO,EAAE,QAgCrB,CAAC"}
+{"version":3,"file":"dependency-edge.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/dependency-edge.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMvD,OAAO,8BAA8B,CAAC;AAEtC,QAAA,MAAM,IAAI,EAAE,IAWX,CAAC;AAEF,eAAe,IAAI,CAAC;AA2BpB,eAAO,MAAM,OAAO,EAAE,QAiCrB,CAAC"}

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

@@ -54,5 +54,5 @@ export const Default = {
                 target: 'child',
                 type: 'dependencyEdge',
             },
-        ], nodeTypes: { featureNode: FeatureNode }, edgeTypes: { dependencyEdge: DependencyEdge }, fitView: true, nodesDraggable: false, nodesConnectable: false })),
+        ], nodeTypes: { featureNode: FeatureNode }, edgeTypes: { dependencyEdge: DependencyEdge }, fitView: true, nodesDraggable: false, nodesConnectable: false, proOptions: { hideAttribution: true } })),
 };

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

@@ -1,4 +1,4 @@
-import type { Connection, Edge, NodeChange } from '@xyflow/react';
+import type { Connection, Edge, NodeChange, OnMoveEnd, Viewport } from '@xyflow/react';
 import type { FeatureNodeType } from '../../common/feature-node/index.js';
 import type { RepositoryNodeType } from '../../common/repository-node/index.js';
 export type CanvasNodeType = FeatureNodeType | RepositoryNodeType;
@@ -6,14 +6,17 @@ export interface FeaturesCanvasProps {
     nodes: CanvasNodeType[];
     edges: Edge[];
     selectedFeatureId?: string | null;
+    defaultViewport?: Viewport;
     onNodesChange?: (changes: NodeChange<CanvasNodeType>[]) => void;
     onAddFeature?: () => void;
     onNodeClick?: (event: React.MouseEvent, node: CanvasNodeType) => void;
     onPaneClick?: (event: React.MouseEvent) => void;
     onConnect?: (connection: Connection) => void;
     onCanvasDrag?: () => void;
+    onMoveEnd?: OnMoveEnd;
+    onResetViewport?: () => Viewport;
     toolbar?: React.ReactNode;
     emptyState?: React.ReactNode;
 }
-export declare function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, toolbar, emptyState, }: FeaturesCanvasProps): import("react/jsx-runtime").JSX.Element;
+export declare function FeaturesCanvas({ nodes, edges, selectedFeatureId, defaultViewport, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, onMoveEnd, onResetViewport, toolbar, emptyState, }: FeaturesCanvasProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=features-canvas.d.ts.map

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

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

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

@@ -1,14 +1,23 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { ReactFlow, Background, Controls } from '@xyflow/react';
-import { Plus } from 'lucide-react';
+import { useCallback, useMemo } from 'react';
+import { ReactFlow, Background, Controls, ControlButton, useReactFlow } from '@xyflow/react';
+import { Plus, RotateCcw } from 'lucide-react';
 import { Button } from '../../ui/button.js';
 import { EmptyState } from '../../common/empty-state/index.js';
 import { FeatureNode } from '../../common/feature-node/index.js';
 import { RepositoryNode } from '../../common/repository-node/index.js';
 import { DependencyEdge } from './dependency-edge.js';
-export function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, toolbar, emptyState, }) {
+const FALLBACK_VIEWPORT = { x: 30, y: 30, zoom: 0.85 };
+function ResetButton({ onResetViewport }) {
+    const { setViewport } = useReactFlow();
+    const handleReset = useCallback(() => {
+        const viewport = onResetViewport();
+        setViewport(viewport, { duration: 400 });
+    }, [onResetViewport, setViewport]);
+    return (_jsx(ControlButton, { onClick: handleReset, title: "Reset view", "aria-label": "Reset view", children: _jsx(RotateCcw, {}) }));
+}
+export function FeaturesCanvas({ nodes, edges, selectedFeatureId, defaultViewport, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, onMoveEnd, onResetViewport, toolbar, emptyState, }) {
     const nodeTypes = useMemo(() => ({
         featureNode: FeatureNode,
         repositoryNode: RepositoryNode,
@@ -30,5 +39,5 @@ export function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange,
         }
         return (_jsx("div", { "data-testid": "features-canvas-empty", children: _jsx(EmptyState, { title: "No features yet", description: "Get started by creating your first feature.", action: _jsxs(Button, { onClick: onAddFeature, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "New Feature"] }) }) }));
     }
-    return (_jsx("div", { "data-testid": "features-canvas", "data-no-drawer-close": true, className: "pointer-events-auto h-full w-full", children: _jsxs(ReactFlow, { nodes: enrichedNodes, edges: edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, onConnect: onConnect, onNodesChange: onNodesChange, onNodeClick: onNodeClick, onPaneClick: onPaneClick, onMoveStart: onCanvasDrag, defaultViewport: { x: 30, y: 30, zoom: 0.85 }, nodesDraggable: false, nodesConnectable: false, elementsSelectable: false, children: [_jsx(Background, {}), _jsx(Controls, {}), toolbar] }) }));
+    return (_jsx("div", { "data-testid": "features-canvas", "data-no-drawer-close": true, className: "pointer-events-auto h-full w-full", children: _jsxs(ReactFlow, { nodes: enrichedNodes, edges: edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, onConnect: onConnect, onNodesChange: onNodesChange, onNodeClick: onNodeClick, onPaneClick: onPaneClick, onMoveStart: onCanvasDrag, onMoveEnd: onMoveEnd, defaultViewport: defaultViewport ?? FALLBACK_VIEWPORT, nodesDraggable: false, nodesConnectable: false, elementsSelectable: false, proOptions: { hideAttribution: true }, children: [_jsx(Background, {}), _jsx(Controls, { showInteractive: false, children: onResetViewport ? _jsx(ResetButton, { onResetViewport: onResetViewport }) : null }), toolbar] }) }));
 }

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

@@ -14,4 +14,6 @@ export declare const SingleRepositoryMultipleFeatures: Story;
 export declare const MultipleRepositories: Story;
 export declare const MultipleRepositoriesMixedConnections: Story;
 export declare const InteractiveWithRepository: Story;
+export declare const WithSavedViewport: Story;
+export declare const ZoomedOutViewport: Story;
 //# sourceMappingURL=features-canvas.stories.d.ts.map

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

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

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

@@ -516,3 +516,19 @@ export const InteractiveWithRepository = {
         onAddFeature: () => undefined,
     },
 };
+export const WithSavedViewport = {
+    args: {
+        nodes: repoFeatureNodes,
+        edges: repoFeatureEdges,
+        defaultViewport: { x: 200, y: 150, zoom: 1.0 },
+        onResetViewport: () => ({ x: 30, y: 30, zoom: 0.85 }),
+    },
+};
+export const ZoomedOutViewport = {
+    args: {
+        nodes: mixedLayoutedNodes,
+        edges: mixedLayoutedEdges,
+        defaultViewport: { x: 0, y: 0, zoom: 0.5 },
+        onResetViewport: () => ({ x: 30, y: 30, zoom: 0.85 }),
+    },
+};

package/dist/src/presentation/web/hooks/use-viewport-persistence.d.ts

@@ -0,0 +1,11 @@
+import type { Viewport } from '@xyflow/react';
+export declare const STORAGE_KEY = "shep-canvas-viewport";
+export declare const DEBOUNCE_MS = 500;
+export declare const DEFAULT_VIEWPORT: Viewport;
+export interface UseViewportPersistenceResult {
+    defaultViewport: Viewport;
+    onMoveEnd: (viewport: Viewport) => void;
+    resetViewport: () => Viewport;
+}
+export declare function useViewportPersistence(): UseViewportPersistenceResult;
+//# sourceMappingURL=use-viewport-persistence.d.ts.map

package/dist/src/presentation/web/hooks/use-viewport-persistence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-viewport-persistence.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-viewport-persistence.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAE9C,eAAO,MAAM,WAAW,yBAAyB,CAAC;AAClD,eAAO,MAAM,WAAW,MAAM,CAAC;AAE/B,eAAO,MAAM,gBAAgB,EAAE,QAAuC,CAAC;AAEvE,MAAM,WAAW,4BAA4B;IAC3C,eAAe,EAAE,QAAQ,CAAC;IAC1B,SAAS,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,MAAM,QAAQ,CAAC;CAC/B;AA6BD,wBAAgB,sBAAsB,IAAI,4BAA4B,CAmCrE"}

package/dist/src/presentation/web/hooks/use-viewport-persistence.js

@@ -0,0 +1,64 @@
+'use client';
+import { useCallback, useEffect, useRef } from 'react';
+export const STORAGE_KEY = 'shep-canvas-viewport';
+export const DEBOUNCE_MS = 500;
+export const DEFAULT_VIEWPORT = { x: 30, y: 30, zoom: 0.85 };
+function isValidViewport(value) {
+    if (value == null || typeof value !== 'object' || Array.isArray(value)) {
+        return false;
+    }
+    const v = value;
+    return (typeof v.x === 'number' &&
+        typeof v.y === 'number' &&
+        typeof v.zoom === 'number' &&
+        Number.isFinite(v.x) &&
+        Number.isFinite(v.y) &&
+        Number.isFinite(v.zoom) &&
+        v.zoom > 0);
+}
+function readViewport() {
+    try {
+        const raw = localStorage.getItem(STORAGE_KEY);
+        if (raw == null)
+            return DEFAULT_VIEWPORT;
+        const parsed = JSON.parse(raw);
+        return isValidViewport(parsed) ? parsed : DEFAULT_VIEWPORT;
+    }
+    catch {
+        return DEFAULT_VIEWPORT;
+    }
+}
+export function useViewportPersistence() {
+    const defaultViewport = useRef(readViewport()).current;
+    const timerRef = useRef(null);
+    useEffect(() => {
+        return () => {
+            if (timerRef.current != null) {
+                clearTimeout(timerRef.current);
+            }
+        };
+    }, []);
+    const onMoveEnd = useCallback((viewport) => {
+        if (timerRef.current != null) {
+            clearTimeout(timerRef.current);
+        }
+        timerRef.current = setTimeout(() => {
+            try {
+                localStorage.setItem(STORAGE_KEY, JSON.stringify(viewport));
+            }
+            catch {
+                // Silently ignore localStorage errors (quota exceeded, private browsing, etc.)
+            }
+        }, DEBOUNCE_MS);
+    }, []);
+    const resetViewport = useCallback(() => {
+        try {
+            localStorage.removeItem(STORAGE_KEY);
+        }
+        catch {
+            // Silently ignore localStorage errors
+        }
+        return DEFAULT_VIEWPORT;
+    }, []);
+    return { defaultViewport, onMoveEnd, resetViewport };
+}