@pi-unipi/notify 2.6.1 → 2.9.0

package/tui/recap-model-selector.ts

@@ -7,9 +7,9 @@
  */
 
 import type { Component } from "@earendil-works/pi-tui";
-import { matchesKey, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { matchesKey } from "@earendil-works/pi-tui";
 import type { Theme } from "@earendil-works/pi-coding-agent";
-import { readModelCache, type CachedModel, boxInnerWidth } from "@pi-unipi/core";
+import { readModelCache, type CachedModel, boxInnerWidth, OverlayTheme } from "@pi-unipi/core";
 import { loadConfig, saveConfig } from "../settings.js";
 
 const DEFAULT_MODEL = "openrouter/openai/gpt-oss-20b";
@@ -27,7 +27,7 @@ export class RecapModelSelectorOverlay implements Component {
   private error: string | null = null;
   onClose?: () => void;
   requestRender?: () => void;
-  private theme: Theme | null = null;
+  private overlay = new OverlayTheme();
 
   /**
    * @param models Optional model list, preferably collected from Pi's live
@@ -51,7 +51,7 @@ export class RecapModelSelectorOverlay implements Component {
   }
 
   setTheme(theme: Theme): void {
-    this.theme = theme;
+    this.overlay.setTheme(theme);
   }
 
   invalidate(): void {}
@@ -169,84 +169,49 @@ export class RecapModelSelectorOverlay implements Component {
     setTimeout(() => this.onClose?.(), 500);
   }
 
-  // ─── Theme helpers ───────────────────────────────────────────────────
-
-  private fg(color: string, text: string): string {
-    if (this.theme) return this.theme.fg(color as any, text);
-    const c: Record<string, string> = {
-      accent: "\x1b[36m",
-      success: "\x1b[32m",
-      warning: "\x1b[33m",
-      error: "\x1b[31m",
-      dim: "\x1b[2m",
-      borderMuted: "\x1b[90m",
-    };
-    return `${c[color] ?? ""}${text}\x1b[0m`;
-  }
-
-  private bold(text: string): string {
-    return this.theme ? this.theme.bold(text) : `\x1b[1m${text}\x1b[0m`;
-  }
-
-  private frameLine(content: string, innerWidth: number): string {
-    const truncated = truncateToWidth(content, innerWidth, "");
-    const padding = Math.max(0, innerWidth - visibleWidth(truncated));
-    return `${this.fg("borderMuted", "│")}${truncated}${" ".repeat(padding)}${this.fg("borderMuted", "│")}`;
-  }
-
-  private ruleLine(innerWidth: number): string {
-    return this.fg("borderMuted", `├${"─".repeat(innerWidth)}┤`);
-  }
-
-  private borderLine(innerWidth: number, edge: "top" | "bottom"): string {
-    const left = edge === "top" ? "┌" : "└";
-    const right = edge === "top" ? "┐" : "┘";
-    return this.fg("borderMuted", `${left}${"─".repeat(innerWidth)}${right}`);
-  }
-
   render(width: number): string[] {
     const innerWidth = boxInnerWidth(width);
     const lines: string[] = [];
 
-    lines.push(this.borderLine(innerWidth, "top"));
+    lines.push(this.overlay.borderLine(innerWidth, "top"));
     lines.push(
-      this.frameLine(
-        this.fg("accent", this.bold("🤖 Recap Model Selector")),
+      this.overlay.frameLine(
+        this.overlay.fg("accent", this.overlay.bold("🤖 Recap Model Selector")),
         innerWidth
       )
     );
     lines.push(
-      this.frameLine(
-        this.fg("dim", "Select model for notification recaps"),
+      this.overlay.frameLine(
+        this.overlay.fg("dim", "Select model for notification recaps"),
         innerWidth
       )
     );
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
 
     // Filter bar
     if (this.filterMode) {
       lines.push(
-        this.frameLine(
-          `  ${this.fg("accent", "Filter:")} ${this.filter}${this.fg("accent", "█")}`,
+        this.overlay.frameLine(
+          `  ${this.overlay.fg("accent", "Filter:")} ${this.filter}${this.overlay.fg("accent", "█")}`,
           innerWidth
         )
       );
     } else if (this.filter) {
       lines.push(
-        this.frameLine(
-          `  ${this.fg("dim", "Filter:")} ${this.filter} ${this.fg("dim", "(press / to edit)")}`,
+        this.overlay.frameLine(
+          `  ${this.overlay.fg("dim", "Filter:")} ${this.filter} ${this.overlay.fg("dim", "(press / to edit)")}`,
           innerWidth
         )
       );
     } else {
       lines.push(
-        this.frameLine(
-          `  ${this.fg("dim", `/${this.models.length} models · press / to filter`)}`,
+        this.overlay.frameLine(
+          `  ${this.overlay.fg("dim", `/${this.models.length} models · press / to filter`)}`,
           innerWidth
         )
       );
     }
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
 
     // Model list
     const terminalRows = process.stdout.rows ?? 30;
@@ -268,8 +233,8 @@ export class RecapModelSelectorOverlay implements Component {
             ? "No models — check ~/.pi/agent/models.json or API keys, then reopen"
             : "No models found";
       lines.push(
-        this.frameLine(
-          `  ${this.fg("dim", emptyMsg)}`,
+        this.overlay.frameLine(
+          `  ${this.overlay.fg("dim", emptyMsg)}`,
           innerWidth
         )
       );
@@ -277,20 +242,20 @@ export class RecapModelSelectorOverlay implements Component {
       for (let i = startIdx; i < endIdx; i++) {
         const m = this.filteredModels[i];
         const isSelected = i === this.selectedIndex;
-        const marker = isSelected ? this.fg("accent", "▸") : " ";
+        const marker = isSelected ? this.overlay.fg("accent", "▸") : " ";
         const label = m.name || m.id;
         const fullRef = `${m.provider}/${m.id}`;
         const isDefault = fullRef === DEFAULT_MODEL;
         const defaultTag = isDefault
-          ? ` ${this.fg("warning", "(default)")}`
+          ? ` ${this.overlay.fg("warning", "(default)")}`
           : "";
 
-        const providerTag = this.fg("dim", `[${m.provider}]`);
+        const providerTag = this.overlay.fg("dim", `[${m.provider}]`);
         const display = isSelected
-          ? `${providerTag} ${this.bold(label)}${defaultTag}`
-          : `${providerTag} ${this.fg("dim", label)}${defaultTag}`;
+          ? `${providerTag} ${this.overlay.bold(label)}${defaultTag}`
+          : `${providerTag} ${this.overlay.fg("dim", label)}${defaultTag}`;
 
-        lines.push(this.frameLine(`  ${marker} ${display}`, innerWidth));
+        lines.push(this.overlay.frameLine(`  ${marker} ${display}`, innerWidth));
       }
     }
 
@@ -300,8 +265,8 @@ export class RecapModelSelectorOverlay implements Component {
         ((this.selectedIndex + 1) / this.filteredModels.length) * 100
       );
       lines.push(
-        this.frameLine(
-          this.fg("dim", `  ${pct}% (${this.selectedIndex + 1}/${this.filteredModels.length})`),
+        this.overlay.frameLine(
+          this.overlay.fg("dim", `  ${pct}% (${this.selectedIndex + 1}/${this.filteredModels.length})`),
           innerWidth
         )
       );
@@ -309,33 +274,33 @@ export class RecapModelSelectorOverlay implements Component {
 
     // Status messages
     if (this.error) {
-      lines.push(this.ruleLine(innerWidth));
+      lines.push(this.overlay.ruleLine(innerWidth));
       lines.push(
-        this.frameLine(`  ${this.fg("error", `⚠ ${this.error}`)}`, innerWidth)
+        this.overlay.frameLine(`  ${this.overlay.fg("error", `⚠ ${this.error}`)}`, innerWidth)
       );
     }
     if (this.saved) {
-      lines.push(this.ruleLine(innerWidth));
+      lines.push(this.overlay.ruleLine(innerWidth));
       lines.push(
-        this.frameLine(
-          `  ${this.fg("success", "✓ Model saved")}`,
+        this.overlay.frameLine(
+          `  ${this.overlay.fg("success", "✓ Model saved")}`,
           innerWidth
         )
       );
     }
 
     // Footer
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
     lines.push(
-      this.frameLine(
-        this.fg(
+      this.overlay.frameLine(
+        this.overlay.fg(
           "dim",
           "↑↓ navigate · / filter · Enter select · Esc cancel"
         ),
         innerWidth
       )
     );
-    lines.push(this.borderLine(innerWidth, "bottom"));
+    lines.push(this.overlay.borderLine(innerWidth, "bottom"));
 
     return lines;
   }

package/tui/settings-overlay.ts

@@ -6,7 +6,7 @@
  */
 
 import type { Component } from "@earendil-works/pi-tui";
-import { matchesKey, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { matchesKey } from "@earendil-works/pi-tui";
 import type { Theme } from "@earendil-works/pi-coding-agent";
 import {
   loadConfig,
@@ -15,7 +15,7 @@ import {
 } from "../settings.js";
 import { loadNtfyConfig, saveNtfyConfig, getNtfyConfigScope } from "../ntfy-config.js";
 import type { NotifyConfig, NtfyConfig } from "../types.js";
-import { boxInnerWidth } from "@pi-unipi/core";
+import { OverlayTheme, boxInnerWidth } from "@pi-unipi/core";
 
 /** Section types */
 type Section = "platforms" | "events" | "recap";
@@ -35,7 +35,7 @@ export class NotifySettingsOverlay implements Component {
   requestRender?: () => void;
   /** Called when user presses M in recap section to open model selector */
   onOpenModelSelector?: () => void;
-  private theme: Theme | null = null;
+  private overlay = new OverlayTheme();
 
   constructor() {
     this.config = loadConfig();
@@ -45,7 +45,7 @@ export class NotifySettingsOverlay implements Component {
   }
 
   setTheme(theme: Theme): void {
-    this.theme = theme;
+    this.overlay.setTheme(theme);
   }
 
   invalidate(): void {}
@@ -151,66 +151,30 @@ export class NotifySettingsOverlay implements Component {
     setTimeout(() => this.onClose?.(), 500);
   }
 
-  // ─── Theme helpers ───────────────────────────────────────────────────
-
-  private fg(color: string, text: string): string {
-    if (this.theme) return this.theme.fg(color as any, text);
-    const c: Record<string, string> = {
-      accent: "\x1b[36m", success: "\x1b[32m", warning: "\x1b[33m",
-      error: "\x1b[31m", dim: "\x1b[2m", borderMuted: "\x1b[90m",
-    };
-    return `${c[color] ?? ""}${text}\x1b[0m`;
-  }
-
-  private bold(text: string): string {
-    return this.theme ? this.theme.bold(text) : `\x1b[1m${text}\x1b[0m`;
-  }
-
-  private frameLine(content: string, innerWidth: number): string {
-    const truncated = truncateToWidth(content, innerWidth, "");
-    const padding = Math.max(0, innerWidth - visibleWidth(truncated));
-    return `${this.fg("borderMuted", "│")}${truncated}${" ".repeat(padding)}${this.fg("borderMuted", "│")}`;
-  }
-
-  private ruleLine(innerWidth: number): string {
-    return this.fg("borderMuted", `├${"─".repeat(innerWidth)}┤`);
-  }
-
-  private borderLine(innerWidth: number, edge: "top" | "bottom"): string {
-    const left = edge === "top" ? "┌" : "└";
-    const right = edge === "top" ? "┐" : "┘";
-    return this.fg("borderMuted", `${left}${"─".repeat(innerWidth)}${right}`);
-  }
-
-  private getDialogHeight(): number {
-    const terminalRows = process.stdout.rows ?? 30;
-    return Math.max(14, Math.min(24, Math.floor(terminalRows * 0.65)));
-  }
-
   render(width: number): string[] {
     const innerWidth = boxInnerWidth(width);
     const lines: string[] = [];
 
-    lines.push(this.borderLine(innerWidth, "top"));
-    lines.push(this.frameLine(this.fg("accent", this.bold("🔔 Notify Settings")), innerWidth));
-    lines.push(this.frameLine(this.fg("dim", "Configure notification platforms and events"), innerWidth));
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.borderLine(innerWidth, "top"));
+    lines.push(this.overlay.frameLine(this.overlay.fg("accent", this.overlay.bold("🔔 Notify Settings")), innerWidth));
+    lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Configure notification platforms and events"), innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
 
     // Section tabs
     const platformTab =
       this.section === "platforms"
-        ? this.fg("accent", this.bold("[Platforms]"))
-        : this.fg("dim", "Platforms");
+        ? this.overlay.fg("accent", this.overlay.bold("[Platforms]"))
+        : this.overlay.fg("dim", "Platforms");
     const eventsTab =
       this.section === "events"
-        ? this.fg("accent", this.bold("[Events]"))
-        : this.fg("dim", "Events");
+        ? this.overlay.fg("accent", this.overlay.bold("[Events]"))
+        : this.overlay.fg("dim", "Events");
     const recapTab =
       this.section === "recap"
-        ? this.fg("accent", this.bold("[Recap]"))
-        : this.fg("dim", "Recap");
-    lines.push(this.frameLine(`  ${platformTab}  ${eventsTab}  ${recapTab}`, innerWidth));
-    lines.push(this.ruleLine(innerWidth));
+        ? this.overlay.fg("accent", this.overlay.bold("[Recap]"))
+        : this.overlay.fg("dim", "Recap");
+    lines.push(this.overlay.frameLine(`  ${platformTab}  ${eventsTab}  ${recapTab}`, innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
 
     if (this.section === "platforms") {
       this.renderPlatforms(lines, innerWidth);
@@ -222,21 +186,21 @@ export class NotifySettingsOverlay implements Component {
 
     // Status messages
     if (this.error) {
-      lines.push(this.ruleLine(innerWidth));
-      lines.push(this.frameLine(`  ${this.fg("error", `⚠ ${this.error}`)}`, innerWidth));
+      lines.push(this.overlay.ruleLine(innerWidth));
+      lines.push(this.overlay.frameLine(`  ${this.overlay.fg("error", `⚠ ${this.error}`)}`, innerWidth));
     }
     if (this.saved) {
-      lines.push(this.ruleLine(innerWidth));
-      lines.push(this.frameLine(`  ${this.fg("success", "✓ Settings saved")}`, innerWidth));
+      lines.push(this.overlay.ruleLine(innerWidth));
+      lines.push(this.overlay.frameLine(`  ${this.overlay.fg("success", "✓ Settings saved")}`, innerWidth));
     }
 
     // Footer
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
     const footerHint = this.section === "recap"
       ? "↑↓ navigate · Space toggle · M change model · Tab switch · Enter save · Esc cancel"
       : "↑↓ navigate · Space toggle · Tab switch · Enter save · Esc cancel";
-    lines.push(this.frameLine(this.fg("dim", footerHint), innerWidth));
-    lines.push(this.borderLine(innerWidth, "bottom"));
+    lines.push(this.overlay.frameLine(this.overlay.fg("dim", footerHint), innerWidth));
+    lines.push(this.overlay.borderLine(innerWidth, "bottom"));
 
     return lines;
   }
@@ -278,16 +242,16 @@ export class NotifySettingsOverlay implements Component {
     for (let i = 0; i < platforms.length; i++) {
       const p = platforms[i];
       const isSelected = i === this.selectedIndex;
-      const toggleOn = this.fg("success", "●");
-      const toggleOff = this.fg("dim", "○");
+      const toggleOn = this.overlay.fg("success", "●");
+      const toggleOff = this.overlay.fg("dim", "○");
       // ntfy enabled state comes from resolved ntfy.json, not config.json
       const isEnabled = p.key === "ntfy" ? this.ntfyConfig.enabled : this.config[p.key].enabled;
       const toggle = isEnabled ? toggleOn : toggleOff;
-      const label = isSelected ? this.bold(p.label) : this.fg("dim", p.label);
+      const label = isSelected ? this.overlay.bold(p.label) : this.overlay.fg("dim", p.label);
 
       lines.push(
-        this.frameLine(
-          `${isSelected ? this.fg("accent", "▸") : " "} ${toggle} ${label}  ${this.fg("dim", p.detail)}`,
+        this.overlay.frameLine(
+          `${isSelected ? this.overlay.fg("accent", "▸") : " "} ${toggle} ${label}  ${this.overlay.fg("dim", p.detail)}`,
           innerWidth
         )
       );
@@ -298,17 +262,17 @@ export class NotifySettingsOverlay implements Component {
       const i = platforms.length;
       const isSelected = i === this.selectedIndex;
       const isEnabled = this.config.native.suppressWhenFocused === true;
-      const toggleOn = this.fg("success", "●");
-      const toggleOff = this.fg("dim", "○");
+      const toggleOn = this.overlay.fg("success", "●");
+      const toggleOff = this.overlay.fg("dim", "○");
       const toggle = isEnabled ? toggleOn : toggleOff;
       const label = isSelected
-        ? this.bold("Suppress when focused")
-        : this.fg("dim", "Suppress when focused");
-      const detail = this.fg("dim", isEnabled ? "Windows only — terminal in foreground → skip" : "Windows only");
+        ? this.overlay.bold("Suppress when focused")
+        : this.overlay.fg("dim", "Suppress when focused");
+      const detail = this.overlay.fg("dim", isEnabled ? "Windows only — terminal in foreground → skip" : "Windows only");
 
       lines.push(
-        this.frameLine(
-          `${isSelected ? this.fg("accent", "▸") : " "} ${toggle} ${label}  ${detail}`,
+        this.overlay.frameLine(
+          `${isSelected ? this.overlay.fg("accent", "▸") : " "} ${toggle} ${label}  ${detail}`,
           innerWidth
         )
       );
@@ -321,14 +285,14 @@ export class NotifySettingsOverlay implements Component {
     for (let i = 0; i < events.length; i++) {
       const [key, cfg] = events[i];
       const isSelected = i === this.selectedIndex;
-      const toggleOn = this.fg("success", "●");
-      const toggleOff = this.fg("dim", "○");
+      const toggleOn = this.overlay.fg("success", "●");
+      const toggleOff = this.overlay.fg("dim", "○");
       const toggle = cfg.enabled ? toggleOn : toggleOff;
-      const label = isSelected ? this.bold(key) : this.fg("dim", key);
+      const label = isSelected ? this.overlay.bold(key) : this.overlay.fg("dim", key);
 
       lines.push(
-        this.frameLine(
-          `${isSelected ? this.fg("accent", "▸") : " "} ${toggle} ${label}`,
+        this.overlay.frameLine(
+          `${isSelected ? this.overlay.fg("accent", "▸") : " "} ${toggle} ${label}`,
           innerWidth
         )
       );
@@ -338,27 +302,27 @@ export class NotifySettingsOverlay implements Component {
   private renderRecap(lines: string[], innerWidth: number): void {
     // Toggle
     const isSelected = this.selectedIndex === 0;
-    const toggleOn = this.fg("success", "●");
-    const toggleOff = this.fg("dim", "○");
+    const toggleOn = this.overlay.fg("success", "●");
+    const toggleOff = this.overlay.fg("dim", "○");
     const toggle = this.config.recap.enabled ? toggleOn : toggleOff;
     const label = isSelected
-      ? this.bold("Enable Recap")
-      : this.fg("dim", "Enable Recap");
+      ? this.overlay.bold("Enable Recap")
+      : this.overlay.fg("dim", "Enable Recap");
 
     lines.push(
-      this.frameLine(
-        `${isSelected ? this.fg("accent", "▸") : " "} ${toggle} ${label}`,
+      this.overlay.frameLine(
+        `${isSelected ? this.overlay.fg("accent", "▸") : " "} ${toggle} ${label}`,
         innerWidth
       )
     );
 
     // Current model display
     const modelRef = this.config.recap.model;
-    const modelLabel = this.fg("dim", `  Model: ${modelRef}`);
-    lines.push(this.frameLine(modelLabel, innerWidth));
+    const modelLabel = this.overlay.fg("dim", `  Model: ${modelRef}`);
+    lines.push(this.overlay.frameLine(modelLabel, innerWidth));
     lines.push(
-      this.frameLine(
-        this.fg("dim", "  Press M to change model"),
+      this.overlay.frameLine(
+        this.overlay.fg("dim", "  Press M to change model"),
         innerWidth
       )
     );

package/tui/telegram-setup.ts

@@ -6,11 +6,11 @@
  */
 
 import type { Component } from "@earendil-works/pi-tui";
-import { matchesKey, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { matchesKey } from "@earendil-works/pi-tui";
 import type { Theme } from "@earendil-works/pi-coding-agent";
 import { pollForChatId } from "../platforms/telegram.js";
 import { updateConfig } from "../settings.js";
-import { boxInnerWidth } from "@pi-unipi/core";
+import { OverlayTheme, boxInnerWidth } from "@pi-unipi/core";
 
 type SetupPhase = "instructions" | "token" | "polling" | "success" | "error" | "timeout";
 
@@ -35,10 +35,10 @@ export class TelegramSetupOverlay implements Component {
   private pasteBuffer = "";
   onClose?: () => void;
   requestRender?: () => void;
-  private theme: Theme | null = null;
+  private overlay = new OverlayTheme();
 
   setTheme(theme: Theme): void {
-    this.theme = theme;
+    this.overlay.setTheme(theme);
   }
 
   invalidate(): void {}
@@ -193,110 +193,79 @@ export class TelegramSetupOverlay implements Component {
     }
   }
 
-  // ─── Theme helpers ───────────────────────────────────────────────────
-
-  private fg(color: string, text: string): string {
-    if (this.theme) return this.theme.fg(color as any, text);
-    const c: Record<string, string> = {
-      accent: "\x1b[36m", success: "\x1b[32m", warning: "\x1b[33m",
-      error: "\x1b[31m", dim: "\x1b[2m", borderMuted: "\x1b[90m",
-    };
-    return `${c[color] ?? ""}${text}\x1b[0m`;
-  }
-
-  private bold(text: string): string {
-    return this.theme ? this.theme.bold(text) : `\x1b[1m${text}\x1b[0m`;
-  }
-
-  private frameLine(content: string, innerWidth: number): string {
-    const truncated = truncateToWidth(content, innerWidth, "");
-    const padding = Math.max(0, innerWidth - visibleWidth(truncated));
-    return `${this.fg("borderMuted", "│")}${truncated}${" ".repeat(padding)}${this.fg("borderMuted", "│")}`;
-  }
-
-  private ruleLine(innerWidth: number): string {
-    return this.fg("borderMuted", `├${"─".repeat(innerWidth)}┤`);
-  }
-
-  private borderLine(innerWidth: number, edge: "top" | "bottom"): string {
-    const left = edge === "top" ? "┌" : "└";
-    const right = edge === "top" ? "┐" : "┘";
-    return this.fg("borderMuted", `${left}${"─".repeat(innerWidth)}${right}`);
-  }
-
   render(width: number): string[] {
     const innerWidth = boxInnerWidth(width);
     const lines: string[] = [];
 
-    lines.push(this.borderLine(innerWidth, "top"));
-    lines.push(this.frameLine(this.fg("accent", this.bold("🤖 Telegram Bot Setup")), innerWidth));
-    lines.push(this.ruleLine(innerWidth));
+    lines.push(this.overlay.borderLine(innerWidth, "top"));
+    lines.push(this.overlay.frameLine(this.overlay.fg("accent", this.overlay.bold("🤖 Telegram Bot Setup")), innerWidth));
+    lines.push(this.overlay.ruleLine(innerWidth));
 
     switch (this.phase) {
       case "instructions":
-        lines.push(this.frameLine(this.fg("dim", "Set up Telegram notifications in 3 steps:"), innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.bold("1.")} Open Telegram and message ${this.fg("accent", "@BotFather")}`, innerWidth));
-        lines.push(this.frameLine(`     Send /newbot and follow the prompts to create a bot`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.bold("2.")} Copy the bot token from BotFather`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.bold("3.")} Send any message to your new bot`, innerWidth));
-        lines.push(this.frameLine(`     (We'll detect your chat ID automatically)`, innerWidth));
-        lines.push(this.ruleLine(innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Press Enter to continue, Esc to cancel"), innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Set up Telegram notifications in 3 steps:"), innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.bold("1.")} Open Telegram and message ${this.overlay.fg("accent", "@BotFather")}`, innerWidth));
+        lines.push(this.overlay.frameLine(`     Send /newbot and follow the prompts to create a bot`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.bold("2.")} Copy the bot token from BotFather`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.bold("3.")} Send any message to your new bot`, innerWidth));
+        lines.push(this.overlay.frameLine(`     (We'll detect your chat ID automatically)`, innerWidth));
+        lines.push(this.overlay.ruleLine(innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Press Enter to continue, Esc to cancel"), innerWidth));
         break;
 
       case "token":
-        lines.push(this.frameLine(this.fg("dim", "Paste your bot token from BotFather:"), innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        const display = this.fg("accent", this.bold(this.botToken || " "));
-        lines.push(this.frameLine(`  ${display}${this.fg("dim", "█")}`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Enter to start polling · Esc to cancel"), innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Paste your bot token from BotFather:"), innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        const display = this.overlay.fg("accent", this.overlay.bold(this.botToken || " "));
+        lines.push(this.overlay.frameLine(`  ${display}${this.overlay.fg("dim", "█")}`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Enter to start polling · Esc to cancel"), innerWidth));
         break;
 
       case "polling": {
         const frame = SPINNER_FRAMES[this.spinnerFrame] || "⠋";
         const elapsed = Math.floor((Date.now() - this.startTime) / 1000);
         const remaining = Math.max(0, 300 - elapsed);
-        lines.push(this.frameLine(`  ${this.fg("accent", frame)} ${this.bold("Waiting for first message...")}`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", "Send any message to your bot in Telegram")}`, innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", `Timeout: ${Math.floor(remaining / 60)}:${String(remaining % 60).padStart(2, "0")}`)}`, innerWidth));
-        lines.push(this.ruleLine(innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Esc to cancel"), innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("accent", frame)} ${this.overlay.bold("Waiting for first message...")}`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", "Send any message to your bot in Telegram")}`, innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", `Timeout: ${Math.floor(remaining / 60)}:${String(remaining % 60).padStart(2, "0")}`)}`, innerWidth));
+        lines.push(this.overlay.ruleLine(innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Esc to cancel"), innerWidth));
         break;
       }
 
       case "success":
-        lines.push(this.frameLine(`  ${this.fg("success", "✓ Telegram bot configured!")}`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", `Chat ID: ${this.chatId}`)}`, innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", "Notifications will be sent to this chat")}`, innerWidth));
-        lines.push(this.ruleLine(innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Press Enter to close"), innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("success", "✓ Telegram bot configured!")}`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", `Chat ID: ${this.chatId}`)}`, innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", "Notifications will be sent to this chat")}`, innerWidth));
+        lines.push(this.overlay.ruleLine(innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Press Enter to close"), innerWidth));
         break;
 
       case "error":
-        lines.push(this.frameLine(`  ${this.fg("error", "✗ Setup failed")}`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", this.error || "Unknown error")}`, innerWidth));
-        lines.push(this.ruleLine(innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Press Enter to close"), innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("error", "✗ Setup failed")}`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", this.error || "Unknown error")}`, innerWidth));
+        lines.push(this.overlay.ruleLine(innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Press Enter to close"), innerWidth));
         break;
 
       case "timeout":
-        lines.push(this.frameLine(`  ${this.fg("warning", "⏰ Timed out after 5 minutes")}`, innerWidth));
-        lines.push(this.frameLine("", innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", "Make sure you sent a message to your bot in Telegram")}`, innerWidth));
-        lines.push(this.frameLine(`  ${this.fg("dim", "You can try again with /unipi:notify-set-tg")}`, innerWidth));
-        lines.push(this.ruleLine(innerWidth));
-        lines.push(this.frameLine(this.fg("dim", "Press Enter to close"), innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("warning", "⏰ Timed out after 5 minutes")}`, innerWidth));
+        lines.push(this.overlay.frameLine("", innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", "Make sure you sent a message to your bot in Telegram")}`, innerWidth));
+        lines.push(this.overlay.frameLine(`  ${this.overlay.fg("dim", "You can try again with /unipi:notify-set-tg")}`, innerWidth));
+        lines.push(this.overlay.ruleLine(innerWidth));
+        lines.push(this.overlay.frameLine(this.overlay.fg("dim", "Press Enter to close"), innerWidth));
         break;
     }
 
-    lines.push(this.borderLine(innerWidth, "bottom"));
+    lines.push(this.overlay.borderLine(innerWidth, "bottom"));
     return lines;
   }
 }

package/types.ts

@@ -83,8 +83,6 @@ export interface NotifyConfig {
   gotify: GotifyConfig;
   /** Telegram settings */
   telegram: TelegramConfig;
-  /** ntfy settings */
-  ntfy: NtfyConfig;
   /** Recap summarization settings */
   recap: RecapConfig;
 }