@pencil-agent/nano-pencil 1.11.29 → 1.11.30

package/dist/modes/interactive/components/oauth-selector.d.ts

@@ -5,20 +5,26 @@
  * [COVENANT]: Change → update this header
  */
 import { Container } from "@pencil-agent/tui";
-import type { AuthStorage } from "../../../core/config/auth-storage.js";
+export interface ProviderSelectorItem {
+    id: string;
+    name: string;
+    authType: "oauth" | "api_key";
+    loggedIn?: boolean;
+}
 /**
- * Component that renders an OAuth provider selector
+ * Component that renders a provider selector
  */
 export declare class OAuthSelectorComponent extends Container {
     private listContainer;
     private allProviders;
     private selectedIndex;
     private mode;
-    private authStorage;
     private onSelectCallback;
     private onCancelCallback;
-    constructor(mode: "login" | "logout", authStorage: AuthStorage, onSelect: (providerId: string) => void, onCancel: () => void);
-    private loadProviders;
+    private title;
+    constructor(mode: "login" | "logout", providers: ProviderSelectorItem[], onSelect: (providerId: string) => void, onCancel: () => void, options?: {
+        title?: string;
+    });
     private updateList;
     handleInput(keyData: string): void;
 }

package/dist/modes/interactive/components/oauth-selector.js

@@ -4,35 +4,33 @@
  * [LOCUS]: modes/interactive/components/oauth-selector.ts -
  * [COVENANT]: Change → update this header
  */
-import { getOAuthProviders } from "@pencil-agent/ai";
 import { Container, getEditorKeybindings, Spacer, TruncatedText } from "@pencil-agent/tui";
 import { theme } from "../theme/theme.js";
 import { DynamicBorder } from "./dynamic-border.js";
 /**
- * Component that renders an OAuth provider selector
+ * Component that renders a provider selector
  */
 export class OAuthSelectorComponent extends Container {
     listContainer;
     allProviders = [];
     selectedIndex = 0;
     mode;
-    authStorage;
     onSelectCallback;
     onCancelCallback;
-    constructor(mode, authStorage, onSelect, onCancel) {
+    title;
+    constructor(mode, providers, onSelect, onCancel, options) {
         super();
         this.mode = mode;
-        this.authStorage = authStorage;
+        this.allProviders = providers;
         this.onSelectCallback = onSelect;
         this.onCancelCallback = onCancel;
-        // Load all OAuth providers
-        this.loadProviders();
+        this.title =
+            options?.title ?? (mode === "login" ? "Select provider to login:" : "Select provider to logout:");
         // Add top border
         this.addChild(new DynamicBorder());
         this.addChild(new Spacer(1));
         // Add title
-        const title = mode === "login" ? "Select provider to login:" : "Select provider to logout:";
-        this.addChild(new TruncatedText(theme.bold(title)));
+        this.addChild(new TruncatedText(theme.bold(this.title)));
         this.addChild(new Spacer(1));
         // Create list container
         this.listContainer = new Container();
@@ -43,9 +41,6 @@ export class OAuthSelectorComponent extends Container {
         // Initial render
         this.updateList();
     }
-    loadProviders() {
-        this.allProviders = getOAuthProviders();
-    }
     updateList() {
         this.listContainer.clear();
         for (let i = 0; i < this.allProviders.length; i++) {
@@ -53,10 +48,7 @@ export class OAuthSelectorComponent extends Container {
             if (!provider)
                 continue;
             const isSelected = i === this.selectedIndex;
-            // Check if user is logged in for this provider
-            const credentials = this.authStorage.get(provider.id);
-            const isLoggedIn = credentials?.type === "oauth";
-            const statusIndicator = isLoggedIn ? theme.fg("success", " ✓ logged in") : "";
+            const statusIndicator = provider.loggedIn ? theme.fg("success", " ✓ configured") : "";
             let line = "";
             if (isSelected) {
                 const prefix = theme.fg("accent", "→ ");
@@ -71,7 +63,7 @@ export class OAuthSelectorComponent extends Container {
         }
         // Show "no providers" if empty
         if (this.allProviders.length === 0) {
-            const message = this.mode === "login" ? "No OAuth providers available" : "No OAuth providers logged in. Use /login first.";
+            const message = this.mode === "login" ? "No providers available" : "No providers logged in. Use /login first.";
             this.listContainer.addChild(new TruncatedText(theme.fg("muted", `  ${message}`), 0, 0));
         }
     }

package/dist/modes/interactive/interactive-mode.d.ts

@@ -315,6 +315,7 @@ export declare class InteractiveMode {
     private showSessionSelector;
     private handleResumeSession;
     private showOAuthSelector;
+    private getLoginSelectorProviders;
     private showLoginDialog;
     private handleReloadCommand;
     private handleExportCommand;

package/dist/modes/interactive/interactive-mode.js

@@ -48,7 +48,7 @@ import { FooterComponent } from "./components/footer.js";
 import { appKey, appKeyHint, editorKey, keyHint, rawKeyHint, } from "./components/keybinding-hints.js";
 import { LoginDialogComponent } from "./components/login-dialog.js";
 import { ModelSelectorComponent } from "./components/model-selector.js";
-import { OAuthSelectorComponent } from "./components/oauth-selector.js";
+import { OAuthSelectorComponent, } from "./components/oauth-selector.js";
 import { formatSoulStats } from "./components/soul-stats.js";
 import { ProviderSelectorComponent } from "./components/provider-selector.js";
 import { ScopedModelsSelectorComponent } from "./components/scoped-models-selector.js";
@@ -3647,19 +3647,26 @@ export class InteractiveMode {
         this.showStatus("Resumed session");
     }
     async showOAuthSelector(mode) {
-        if (mode === "logout") {
-            const providers = this.session.modelRegistry.authStorage.list();
-            const loggedInProviders = providers.filter((p) => this.session.modelRegistry.authStorage.get(p)?.type === "oauth");
-            if (loggedInProviders.length === 0) {
-                this.showStatus("No OAuth providers logged in. Use /login first.");
-                return;
-            }
+        const providers = this.getLoginSelectorProviders(mode);
+        if (providers.length === 0) {
+            this.showStatus(mode === "login"
+                ? "No providers available."
+                : "No providers logged in. Use /login first.");
+            return;
         }
         this.showSelector((done) => {
-            const selector = new OAuthSelectorComponent(mode, this.session.modelRegistry.authStorage, async (providerId) => {
+            const selector = new OAuthSelectorComponent(mode, providers, async (providerId) => {
                 done();
                 if (mode === "login") {
-                    await this.showLoginDialog(providerId);
+                    const oauthProvider = getOAuthProviders().find((p) => p.id === providerId);
+                    if (oauthProvider) {
+                        await this.showLoginDialog(providerId);
+                    }
+                    else {
+                        await this.promptForProviderApiKey(providerId, {
+                            title: `Set API key for ${providerId}`,
+                        });
+                    }
                 }
                 else {
                     // Logout flow
@@ -3678,10 +3685,47 @@ export class InteractiveMode {
             }, () => {
                 done();
                 this.ui.requestRender();
+            }, {
+                title: mode === "login"
+                    ? "Select provider to login or configure:"
+                    : "Select provider to logout:",
             });
             return { component: selector, focus: selector };
         });
     }
+    getLoginSelectorProviders(mode) {
+        const oauthProviders = getOAuthProviders().map((provider) => ({
+            id: provider.id,
+            name: provider.name,
+            authType: "oauth",
+            loggedIn: this.session.modelRegistry.authStorage.get(provider.id)?.type ===
+                "oauth",
+        }));
+        if (mode === "logout") {
+            return oauthProviders.filter((provider) => provider.loggedIn);
+        }
+        const items = [...oauthProviders];
+        const providerIds = new Set(items.map((provider) => provider.id));
+        const apiKeyProviders = [
+            { id: "openrouter", name: "OpenRouter" },
+        ];
+        for (const provider of apiKeyProviders) {
+            if (providerIds.has(provider.id))
+                continue;
+            const hasModels = this.session.modelRegistry
+                .getAll()
+                .some((model) => model.provider === provider.id);
+            if (!hasModels)
+                continue;
+            items.push({
+                id: provider.id,
+                name: provider.name,
+                authType: "api_key",
+                loggedIn: !!this.getStoredApiKey(provider.id),
+            });
+        }
+        return items;
+    }
     async showLoginDialog(providerId) {
         const providerInfo = getOAuthProviders().find((p) => p.id === providerId);
         const providerName = providerInfo?.name || providerId;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pencil-agent/nano-pencil",
-  "version": "1.11.29",
+  "version": "1.11.30",
   "description": "CLI writing agent with read, bash, edit, write tools and session management. Based on pi; supports DashScope Coding Plan. Soul enabled by default for AI personality evolution.",
   "type": "module",
   "bin": {