@pellux/goodvibes-tui 0.20.3 → 0.21.0

package/src/panels/local-auth-panel.ts

@@ -11,8 +11,11 @@ import {
   DEFAULT_PANEL_PALETTE,
   type PanelPalette,
 } from './polish.ts';
-import type { LocalAuthSnapshot } from '@pellux/goodvibes-sdk/platform/security';
+import type { LocalAuthSnapshot, UserAuthManager } from '@pellux/goodvibes-sdk/platform/security';
 import type { LocalAuthInspectionQuery } from '../runtime/ui-service-queries.ts';
+import type { KeyName } from './types.ts';
+import { isTextBackspace } from '../input/delete-key-policy.ts';
+import { summarizeError } from '@pellux/goodvibes-sdk/platform/utils';
 
 const C = {
   ...DEFAULT_PANEL_PALETTE,
@@ -28,8 +31,19 @@ function formatRoles(roles: readonly string[]): string {
 
 type LocalAuthUser = LocalAuthSnapshot['users'][number];
 
+/** Action kind for the masked password entry mode. */
+export type MaskedEntryKind = 'add-user' | 'rotate-password';
+
+interface MaskedEntryState {
+  readonly kind: MaskedEntryKind;
+  readonly username: string;
+  readonly auth: UserAuthManager;
+  buffer: string;
+}
+
 export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
   private readonly authManager: LocalAuthInspectionQuery;
+  private maskedState: MaskedEntryState | null = null;
 
   public constructor(authManager: LocalAuthInspectionQuery) {
     super('local-auth', 'Local Auth', 'U', 'monitoring');
@@ -37,6 +51,81 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
     this.authManager = authManager;
   }
 
+  /**
+   * Activate masked password-entry mode for the given operation.
+   * The panel's handleInput will capture keystrokes into a private buffer;
+   * no plaintext is ever recorded in input history, transcript, or logs.
+   */
+  public openMaskedEntry(kind: MaskedEntryKind, username: string, auth: UserAuthManager): void {
+    this.maskedState = { kind, username, auth, buffer: '' };
+    this.invalidate();
+  }
+
+  /** Returns true when the panel is in masked-entry mode. */
+  public get isMaskedEntryActive(): boolean {
+    return this.maskedState !== null;
+  }
+
+  public override handleInput(key: KeyName): boolean {
+    if (this.maskedState === null) {
+      // Delegate scroll/selection to ScrollableListPanel when not in masked mode.
+      return super.handleInput?.(key) ?? false;
+    }
+
+    // Masked entry is active — capture all keystrokes.
+    const state = this.maskedState;
+
+    if (key === 'escape') {
+      // Cancel: discard buffer, exit masked mode without persisting.
+      this.maskedState = null;
+      this.invalidate();
+      return true;
+    }
+
+    if (key === 'enter' || key === 'return') {
+      // Submit: call the auth API if a non-empty password was entered.
+      if (state.buffer.length === 0) {
+        return true; // no-op — require at least one character
+      }
+      const password = state.buffer;
+      const { kind, username, auth } = state;
+      // Clear the mutable state *before* the auth call so the secret
+      // never lingers in the buffer after an exception.
+      this.maskedState = null;
+      try {
+        if (kind === 'add-user') {
+          auth.addUser(username, password, ['admin']);
+        } else {
+          auth.rotatePassword(username, password);
+        }
+      } catch (_error) {
+        // Surface errors via the panel's error facility rather than logging.
+        this.setError(summarizeError(_error));
+      }
+      this.invalidate();
+      return true;
+    }
+
+    if (isTextBackspace(key)) {
+      // Remove last character (Ink 6.8.0: raw-stdin raw 'backspace' only).
+      if (state.buffer.length > 0) {
+        state.buffer = state.buffer.slice(0, -1);
+        this.invalidate();
+      }
+      return true;
+    }
+
+    // Single printable character: append to buffer.
+    if (key.length === 1) {
+      state.buffer += key;
+      this.invalidate();
+      return true;
+    }
+
+    // All other named keys are consumed (ignored) while masked mode is active.
+    return true;
+  }
+
   protected override getPalette(): PanelPalette {
     return C;
   }
@@ -57,6 +146,12 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
   }
 
   public render(width: number, height: number): Line[] {
+    // When masked entry is active, render a dedicated prompt instead of the
+    // normal panel content. No plaintext password appears anywhere in output.
+    if (this.maskedState !== null) {
+      return this.renderMaskedPrompt(width, height);
+    }
+
     const intro = 'Manage local daemon and HTTP-listener auth users, bootstrap state, and active sessions.';
     const snapshot = this.authManager.inspect();
     const users = this.getItems();
@@ -81,7 +176,7 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
         ...(issueMessages.length > 0
           ? issueMessages.map((issue) => buildPanelLine(width, [[` issue: ${issue}`.slice(0, Math.max(0, width)), C.warn]]))
           : [buildPanelLine(width, [[' local auth posture looks healthy.', C.good]])]),
-        buildGuidanceLine(width, '/auth local rotate-password <user> <password>', 'rotate bootstrap/default credentials and revoke older sessions as needed', C),
+        buildGuidanceLine(width, '/auth local rotate-password <user>', 'open masked password entry for the selected user (no plaintext in history)', C),
       ], C),
     ];
 
@@ -104,7 +199,7 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
       footerLines.push(
         ...buildDetailBlock(width, 'Selected user', [
           buildPanelLine(width, [[' username ', C.label], [selected.username, C.value], ['  roles ', C.label], [formatRoles(selected.roles).slice(0, Math.max(0, width - 23)), C.info]]),
-          buildPanelLine(width, [[` next: /auth local rotate-password ${selected.username} <password>`.slice(0, Math.max(0, width)), C.dim]]),
+          buildPanelLine(width, [[` next: /auth local rotate-password ${selected.username}`.slice(0, Math.max(0, width)), C.dim]]),
           buildPanelLine(width, [[` next: /auth local delete-user ${selected.username}`.slice(0, Math.max(0, width)), C.dim]]),
         ], C),
       );
@@ -119,7 +214,7 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
         ])),
       );
     }
-    footerLines.push(buildPanelLine(width, [[' /auth local review  /auth local add-user  /auth local rotate-password  /auth local revoke-session ', C.dim]]));
+    footerLines.push(buildPanelLine(width, [[' /auth local review  /auth local add-user <user>  /auth local rotate-password <user>  (omit password for masked entry) ', C.dim]]));
 
     return this.renderList(width, height, {
       title: 'Local Auth Control Room',
@@ -127,4 +222,29 @@ export class LocalAuthPanel extends ScrollableListPanel<LocalAuthUser> {
       footer: footerLines,
     });
   }
+
+  private renderMaskedPrompt(width: number, height: number): Line[] {
+    const state = this.maskedState!;
+    const actionLabel = state.kind === 'add-user' ? 'Add user' : 'Rotate password';
+    const dots = '•'.repeat(Math.min(32, state.buffer.length));
+    const cursor = '█'; // block cursor
+    const maskedDisplay = state.buffer.length > 0 ? `${dots}${cursor}` : cursor;
+
+    const promptLines: Line[] = [
+      buildPanelLine(width, [[` ${actionLabel}: ${state.username}`, C.value]]),
+      buildPanelLine(width, [['', C.label]]),
+      buildPanelLine(width, [[' Password  ', C.label], [maskedDisplay.slice(0, Math.max(0, width - 12)), C.info]]),
+      buildPanelLine(width, [['', C.label]]),
+      buildPanelLine(width, [[' [Enter] Confirm   [Esc] Cancel   [Backspace] Delete char', C.dim]]),
+    ];
+
+    const workspace = buildPanelWorkspace(width, height, {
+      title: 'Local Auth — Password Entry',
+      intro: `Type a password for ${state.username}. The value is never echoed in plaintext or stored in history.`,
+      sections: [{ lines: promptLines }],
+      palette: C,
+    });
+    while (workspace.length < height) workspace.push(createEmptyLine(width));
+    return workspace;
+  }
 }

package/src/panels/project-planning-panel.ts

@@ -9,6 +9,8 @@ import type {
 } from '@pellux/goodvibes-sdk/platform/knowledge';
 import type { Line } from '../types/grid.ts';
 import { BasePanel } from './base-panel.ts';
+import { handleConfirmInput, renderConfirmLines, type ConfirmState } from './confirm-state.ts';
+import { isTextBackspace, isTextForwardDelete } from '../input/delete-key-policy.ts';
 import {
   buildBodyText,
   buildEmptyState,
@@ -69,6 +71,8 @@ export class ProjectPlanningPanel extends BasePanel {
   private scrollOffset = 0;
   private selectedActionIndex = 0;
   private draftAnswer = '';
+  // Pending confirmation for Delete (clear draft). Null when inactive.
+  private clearDraftConfirm: ConfirmState<'clear-draft'> | null = null;
 
   public constructor(options: ProjectPlanningPanelOptions) {
     super('project-planning', 'Planning', 'P', 'agent');
@@ -86,6 +90,26 @@ export class ProjectPlanningPanel extends BasePanel {
 
   public handleInput(key: string): boolean {
     if (this.lastError !== null) this.clearError();
+
+    // ConfirmState gate: Delete (clear draft) requires y/n confirmation.
+    // handleConfirmInput absorbs all keys while a confirmation is pending.
+    const confirmResult = handleConfirmInput(this.clearDraftConfirm, key);
+    if (confirmResult === 'confirmed') {
+      this.draftAnswer = '';
+      this.clearDraftConfirm = null;
+      this.markDirty();
+      return true;
+    }
+    if (confirmResult === 'cancelled') {
+      this.clearDraftConfirm = null;
+      this.markDirty();
+      return true;
+    }
+    if (confirmResult === 'absorbed') {
+      return true;
+    }
+    // confirmResult === 'inactive': proceed with normal dispatch.
+
     const question = this.getCurrentQuestion();
     if (question) {
       const actions = this.getAnswerActions(question);
@@ -104,13 +128,15 @@ export class ProjectPlanningPanel extends BasePanel {
         this.submitSelectedAction(question, actions);
         return true;
       }
-      if (key === 'backspace') {
+      if (isTextBackspace(key)) {
         this.draftAnswer = this.draftAnswer.slice(0, -1);
         this.markDirty();
         return true;
       }
-      if (key === 'delete') {
-        this.draftAnswer = '';
+      // 'delete' opens the clear-draft confirmation gate (per delete-key policy).
+      // The draft is not wiped until the user confirms with y/Enter.
+      if (isTextForwardDelete(key)) {
+        this.clearDraftConfirm = { subject: 'clear-draft', label: 'draft answer' };
         this.markDirty();
         return true;
       }
@@ -244,8 +270,10 @@ export class ProjectPlanningPanel extends BasePanel {
           [' choose answer  ', C.dim],
           ['type', C.info],
           [' draft  ', C.dim],
-          ['Backspace/Delete', C.info],
+          ['Backspace', C.info],
           [' edit  ', C.dim],
+          ['Del', C.info],
+          [' clear draft  ', C.dim],
           ['Enter', C.info],
           [' submit  Esc prompt focus  Ctrl+X close panel', C.dim],
         ]),
@@ -284,6 +312,16 @@ export class ProjectPlanningPanel extends BasePanel {
   private buildQuestionSection(width: number, question: ProjectPlanningQuestion): RenderedPlanningSection {
     const actions = this.getAnswerActions(question);
     this.selectedActionIndex = this.clampActionIndex(actions.length);
+    // When a clear-draft confirmation is pending, show the confirm prompt
+    // inline above the draft line instead of the normal content.
+    if (this.clearDraftConfirm) {
+      const confirmLines = renderConfirmLines(width, this.clearDraftConfirm);
+      const lines: Line[] = [
+        ...buildBodyText(width, question.prompt, C, C.planning),
+        ...confirmLines,
+      ];
+      return { title: 'Answer Current Question', lines, selectedLineIndex: undefined };
+    }
     const lines: Line[] = [
       ...buildBodyText(width, question.prompt, C, C.planning),
     ];

package/src/panels/search-focus.ts

@@ -1,3 +1,5 @@
+import { isTextBackspace } from '../input/delete-key-policy.ts';
+
 export type PanelSearchFocusTransition = 'focus-search' | 'focus-list' | null;
 
 export function getPanelSearchFocusTransition(
@@ -6,25 +8,29 @@ export function getPanelSearchFocusTransition(
 ): PanelSearchFocusTransition {
   const focusKeys = options.focusKeys ?? ['/'];
   if (focusKeys.includes(key)) return 'focus-search';
-  if ((key === 'up' || key === 'ArrowUp') && options.selectedIndex <= 0) {
+  if (key === 'up' && options.selectedIndex <= 0) {
     return 'focus-search';
   }
-  if ((key === 'down' || key === 'ArrowDown') && options.itemCount > 0) {
+  if (key === 'down' && options.itemCount > 0) {
     return 'focus-list';
   }
   return null;
 }
 
+// Panel search filters are end-anchored (no moveable cursor).
+// Per the delete-key policy (src/input/delete-key-policy.ts):
+//   'backspace' removes the last character.
+//   'delete' is a no-op — there is no cursor, so forward-delete is meaningless.
 export function isPanelSearchBackspace(key: string): boolean {
-  return key === 'backspace' || key === 'delete' || key === 'Backspace' || key === 'Delete';
+  return isTextBackspace(key);
 }
 
 export function isPanelSearchCancel(key: string): boolean {
-  return key === 'escape' || key === 'Escape';
+  return key === 'escape';
 }
 
 export function isPanelSearchCommit(key: string): boolean {
-  return key === 'return' || key === 'enter' || key === 'Enter';
+  return key === 'return' || key === 'enter';
 }
 
 export function isPanelSearchPrintable(key: string): boolean {

package/src/panels/subscription-panel.ts

@@ -1,8 +1,10 @@
 import type { Line } from '../types/grid.ts';
 import { createEmptyLine } from '../types/grid.ts';
 import { ScrollableListPanel } from './scrollable-list-panel.ts';
+import type { KeyName } from './types.ts';
 import type { ProviderSubscription, PendingSubscriptionLogin } from '@pellux/goodvibes-sdk/platform/config';
 import { listBuiltinSubscriptionProviders } from '@pellux/goodvibes-sdk/platform/config';
+import { type ConfirmState, handleConfirmInput } from './confirm-state.ts';
 import type { ServiceInspectionQuery, SubscriptionAccessQuery } from '../runtime/ui-service-queries.ts';
 import {
   buildEmptyState,
@@ -57,7 +59,8 @@ export class SubscriptionPanel extends ScrollableListPanel<SubscriptionRow> {
   private readonly serviceRegistry: Pick<ServiceInspectionQuery, 'getAll'>;
   private readonly subscriptionManager: SubscriptionAccessQuery;
   private rows: SubscriptionRow[] = [];
-  private logoutConfirmationTarget: string | null = null;
+  /** Pending logout confirmation — uses project-standard ConfirmState contract. */
+  private confirm: ConfirmState<string> | null = null;
 
   public constructor(
     serviceRegistry: Pick<ServiceInspectionQuery, 'getAll'>,
@@ -98,42 +101,47 @@ export class SubscriptionPanel extends ScrollableListPanel<SubscriptionRow> {
     ], C, { selected, selectedBg: C.selectedBg });
   }
 
-  public handleInput(key: string): boolean {
+  public handleInput(key: KeyName): boolean {
+    // Project-standard confirm contract: Enter/y confirm; n/Esc cancel; other absorbed.
+    const confirmResult = handleConfirmInput(this.confirm, key);
+    if (confirmResult === 'confirmed') {
+      const provider = this.confirm!.subject;
+      this.confirm = null;
+      this.subscriptionManager.logout(provider);
+      this.refresh();
+      this.markDirty();
+      return true;
+    }
+    if (confirmResult === 'cancelled') {
+      this.confirm = null;
+      this.markDirty();
+      return true;
+    }
+    if (confirmResult === 'absorbed') return true;
+
     if (this.rows.length === 0) return false;
     const selected = this.rows[this.selectedIndex] ?? null;
-    if (key === 'ArrowUp' || key === 'k') {
+    if (key === 'up' || key === 'k') {
       this.selectedIndex = Math.max(0, this.selectedIndex - 1);
-      this.logoutConfirmationTarget = null;
+      this.confirm = null;
       this.markDirty();
       return true;
     }
-    if (key === 'ArrowDown' || key === 'j') {
+    if (key === 'down' || key === 'j') {
       this.selectedIndex = Math.min(this.rows.length - 1, this.selectedIndex + 1);
-      this.logoutConfirmationTarget = null;
+      this.confirm = null;
       this.markDirty();
       return true;
     }
-    if (key === 'enter' || key === 'x') {
+    if (key === 'enter' || key === 'return') {
       if (!selected?.subscription) return false;
-      if (this.logoutConfirmationTarget === null || this.logoutConfirmationTarget !== selected.provider) {
-        this.logoutConfirmationTarget = selected.provider;
-        this.markDirty();
-        return true;
-      }
-      this.subscriptionManager.logout(selected.provider);
-      this.logoutConfirmationTarget = null;
-      this.refresh();
-      this.markDirty();
-      return true;
-    }
-    if ((key === 'n' || key === 'escape') && this.logoutConfirmationTarget) {
-      this.logoutConfirmationTarget = null;
+      this.confirm = { subject: selected.provider, label: selected.provider };
       this.markDirty();
       return true;
     }
     if (key === 'r') {
       this.refresh();
-      this.logoutConfirmationTarget = null;
+      this.confirm = null;
       this.markDirty();
       return true;
     }
@@ -206,7 +214,7 @@ export class SubscriptionPanel extends ScrollableListPanel<SubscriptionRow> {
         sections: [{ lines: [...summaryLines, ...emptyLines] }],
         footerLines: [
           buildGuidanceLine(width, '/subscription login <provider> start', 'start browser-based provider login from the packaged subscription surface', C),
-          buildPanelLine(width, [['  Up/Down move  Enter/X sign out selected provider  r refresh', C.dim]]),
+          buildPanelLine(width, [['  Up/Down move  Enter sign out selected provider  y/Esc confirm/cancel  r refresh', C.dim]]),
         ],
         palette: C,
       });
@@ -236,8 +244,8 @@ export class SubscriptionPanel extends ScrollableListPanel<SubscriptionRow> {
             : 'Stored for subscription-backed flows. Ambient API-key resolution remains unchanged.'}`,
           C.dim,
         ]]));
-        if (this.logoutConfirmationTarget === selectedRow.provider) {
-          detailRows.push(buildPanelLine(width, [[` Press Enter or X again to sign out ${selectedRow.provider}.`, C.warn]]));
+        if (this.confirm?.subject === selectedRow.provider) {
+          detailRows.push(buildPanelLine(width, [[` Sign out ${selectedRow.provider}? Press y or Enter to confirm, n or Esc to cancel.`, C.warn]]));
         }
       } else if (selectedRow.pending) {
         detailRows.push(buildPanelLine(width, [[' Login is pending. Finish with /subscription login <provider> finish <code>.', C.warn]]));
@@ -256,7 +264,7 @@ export class SubscriptionPanel extends ScrollableListPanel<SubscriptionRow> {
       footer: [
         ...detailRows,
         buildGuidanceLine(width, '/subscription login <provider> start', 'start browser-based provider login from the packaged subscription surface', C),
-        buildPanelLine(width, [['  Up/Down move  Enter/X sign out selected provider  r refresh', C.dim]]),
+        buildPanelLine(width, [['  Up/Down move  Enter sign out selected provider  y/Esc confirm/cancel  r refresh', C.dim]]),
       ],
     });
   }

package/src/panels/types.ts

@@ -1,6 +1,33 @@
 import type { Line } from '../types/grid.ts';
 import type { ComponentResourceContract, ComponentHealthState } from '../runtime/perf/panel-contracts.ts';
 
+/**
+ * Named logical key identifiers emitted by the input tokenizer.
+ * These are the ONLY key names that will appear in `handleInput` calls;
+ * the tokenizer never emits DOM/browser-style names like 'ArrowUp' or 'Enter'.
+ *
+ * Printable single-character input is passed through as-is; the `string & {}`
+ * fallback preserves that handling while making named-key completions discoverable
+ * in editors and keeping non-null single-character values compatible.
+ */
+export type NamedKey =
+  | 'up' | 'down' | 'left' | 'right'
+  | 'home' | 'end' | 'pageup' | 'pagedown'
+  | 'insert' | 'delete' | 'backspace'
+  | 'enter' | 'return' | 'escape' | 'space' | 'tab'
+  | 'f1' | 'f2' | 'f3' | 'f4' | 'f5' | 'f6'
+  | 'f7' | 'f8' | 'f9' | 'f10' | 'f11' | 'f12';
+
+/**
+ * The full key type accepted by `Panel.handleInput`.
+ *
+ * Named keys (arrow keys, modifiers, function keys) are represented by
+ * lowercase `NamedKey` members. Single printable characters are passed
+ * verbatim via the `string & {}` escape hatch so panels can handle 'j', 'k',
+ * 'r', etc. without losing type safety on the named members.
+ */
+export type KeyName = NamedKey | (string & {});
+
 export type PanelCategory = 'development' | 'agent' | 'monitoring' | 'session' | 'ai';
 
 export interface Panel {
@@ -35,7 +62,7 @@ export interface Panel {
   healthState?: Readonly<ComponentHealthState>;
 
   // Input (optional)
-  handleInput?(key: string): boolean;
+  handleInput?(key: KeyName): boolean;
 
   // Scroll input (optional)
   // Positive delta scrolls down; negative delta scrolls up.