@zigai/pi-mode 0.2.0 → 0.3.0

package/README.md

@@ -18,12 +18,14 @@ pi install npm:@zigai/pi-mode
 - Adds `Ctrl+Shift+M` to select a mode.
 - Adds `Ctrl+Space` to cycle modes.
 - Can show the current mode in the prompt editor border when enabled.
-- Colors the prompt editor border from the active mode or thinking level.
+- Colors the prompt editor border from the active mode, with an opt-in setting for thinking-derived border colors.
 
 Modes can store a provider, model, thinking level, and optional color. Project-local modes live in `.pi/modes.json` when present; otherwise global modes live in `~/.pi/agent/modes.json`.
 
 By default, Pi Mode does not print the mode name in the editor border. To opt in, toggle `Show mode name` from `/mode` → `Configure modes…`, or set `"modeShowName": true` in global `~/.pi/agent/settings.json` or trusted project `.pi/settings.json`. The `/mode` toggle writes to global settings.
 
+By default, Pi Mode uses the normal editor border color when the active mode does not define an explicit `color`. To opt in to thinking-derived border colors, toggle `Thinking border colors` from `/mode` → `Configure modes…`, or set `"modeUseThinkingBorderColors": true` in global `~/.pi/agent/settings.json` or trusted project `.pi/settings.json`. Explicit per-mode `color` values still apply.
+
 ## License
 
 MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zigai/pi-mode",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Pi package that adds prompt modes for model and thinking-level switching.",
   "keywords": [
     "mode",

package/src/constants.ts

@@ -7,6 +7,8 @@ export const MODE_UI_CONFIGURE = "Configure modes…";
 export const MODE_UI_ADD = "Add mode…";
 export const MODE_UI_SHOW_NAME_ON = "Show mode name: on";
 export const MODE_UI_SHOW_NAME_OFF = "Show mode name: off";
+export const MODE_UI_THINKING_COLORS_ON = "Thinking border colors: on";
+export const MODE_UI_THINKING_COLORS_OFF = "Thinking border colors: off";
 export const MODE_UI_BACK = "Back";
 
 export const ALL_THINKING_LEVELS: ThinkingLevel[] = [

package/src/editor.ts

@@ -63,6 +63,7 @@ function enhanceEditor(
     requestRender: () => void,
 ): EditorLike {
     const originalRender = editor.render.bind(editor);
+    const defaultBorderColor = editor.borderColor;
     editor.render = (width: number) => modeLabelLine(originalRender(width), width, editor);
 
     const borderColor = (text: string) => {
@@ -70,7 +71,7 @@ function enhanceEditor(
         if (isBashMode) {
             return ctx.ui.theme.getBashModeBorderColor()(text);
         }
-        return getModeBorderColor(ctx, pi, getCurrentMode())(text);
+        return getModeBorderColor(ctx, pi, getCurrentMode(), defaultBorderColor)(text);
     };
 
     Object.defineProperty(editor, "borderColor", {

package/src/index.ts

@@ -33,8 +33,11 @@ export default function (pi: ExtensionAPI) {
 
     pi.on("session_start", async (_event, ctx) => {
         setSettingsContext(ctx);
-        await handleSessionActivated(pi, ctx);
+        // Install the editor wrapper before loading mode files so startup renders use
+        // the configured border color immediately instead of briefly showing Pi's
+        // thinking-level border color.
         applyModeEditor(pi, ctx);
+        await handleSessionActivated(pi, ctx);
     });
 
     pi.on("model_select", async (event, ctx) => {

package/src/mode-state.ts

@@ -18,6 +18,8 @@ import {
     MODE_UI_CONFIGURE,
     MODE_UI_SHOW_NAME_OFF,
     MODE_UI_SHOW_NAME_ON,
+    MODE_UI_THINKING_COLORS_OFF,
+    MODE_UI_THINKING_COLORS_ON,
     THINKING_UNSET_LABEL,
 } from "./constants.ts";
 import {
@@ -28,7 +30,12 @@ import {
     getProjectModesPath,
     withFileLock,
 } from "./storage.ts";
-import { setShowModeName, shouldShowModeName } from "./settings.ts";
+import {
+    setShowModeName,
+    setUseThinkingBorderColors,
+    shouldShowModeName,
+    shouldUseThinkingBorderColors,
+} from "./settings.ts";
 import type { ModeRuntime, ModesFile, ModesPatch, ModeSpec, ModeSpecPatch } from "./types.ts";
 
 type ScopedModelItem = {
@@ -403,6 +410,7 @@ export function getModeBorderColor(
     ctx: ExtensionContext,
     pi: ExtensionAPI,
     mode: string,
+    fallbackBorderColor?: (text: string) => string,
 ): (text: string) => string {
     const theme = ctx.ui.theme;
     const spec = runtime.data.modes[mode];
@@ -413,10 +421,15 @@ export function getModeBorderColor(
             theme.getFgAnsi(color);
             return (text: string) => theme.fg(color, text);
         } catch {
-            // fall back to thinking-derived colors
+            // fall through to the configured fallback border color
         }
     }
 
+    if (!shouldUseThinkingBorderColors()) {
+        if (fallbackBorderColor !== undefined) return fallbackBorderColor;
+        return (text: string) => theme.fg("borderMuted", text);
+    }
+
     return theme.getThinkingBorderColor(pi.getThinkingLevel());
 }
 
@@ -854,10 +867,15 @@ async function configureModesUI(pi: ExtensionAPI, ctx: ExtensionContext): Promis
         if (shouldShowModeName()) {
             showModeNameChoice = MODE_UI_SHOW_NAME_ON;
         }
+        let thinkingColorsChoice = MODE_UI_THINKING_COLORS_OFF;
+        if (shouldUseThinkingBorderColors()) {
+            thinkingColorsChoice = MODE_UI_THINKING_COLORS_ON;
+        }
         const choice = await ctx.ui.select("Configure modes", [
             ...names,
             MODE_UI_ADD,
             showModeNameChoice,
+            thinkingColorsChoice,
             MODE_UI_BACK,
         ]);
         if (choice === undefined || choice.length === 0 || choice === MODE_UI_BACK) return;
@@ -887,6 +905,26 @@ async function configureModesUI(pi: ExtensionAPI, ctx: ExtensionContext): Promis
             continue;
         }
 
+        if (choice === MODE_UI_THINKING_COLORS_ON || choice === MODE_UI_THINKING_COLORS_OFF) {
+            const next = !shouldUseThinkingBorderColors();
+            try {
+                setUseThinkingBorderColors(next);
+            } catch (error: unknown) {
+                ctx.ui.notify(
+                    `Thinking border colors were not saved: ${errorMessage(error)}`,
+                    "error",
+                );
+                continue;
+            }
+            requestEditorRender?.();
+            let displayState = "disabled";
+            if (next) {
+                displayState = "enabled";
+            }
+            ctx.ui.notify(`Thinking border colors ${displayState}`, "info");
+            continue;
+        }
+
         await editModeUI(pi, ctx, choice);
     }
 }
@@ -1019,6 +1057,10 @@ export async function handleSessionActivated(
         runtime.currentMode = CUSTOM_MODE_NAME;
         customOverlay = getCurrentSelectionSpec(pi);
     }
+
+    if (ctx.hasUI) {
+        requestEditorRender?.();
+    }
 }
 
 export async function handleModelSelect(

package/src/settings.ts

@@ -19,11 +19,12 @@ import { Type, type TSchema } from "typebox";
 import { Value } from "typebox/value";
 
 export const SHOW_MODE_NAME_SETTINGS_KEY = "modeShowName";
+export const USE_THINKING_BORDER_COLORS_SETTINGS_KEY = "modeUseThinkingBorderColors";
 
 const SETTINGS_LOCK_TIMEOUT_MS = 5_000;
 const STALE_SETTINGS_LOCK_MS = 30_000;
 const SettingsObjectSchema = Type.Object({});
-const ShowModeNameSchema = Type.Boolean();
+const BooleanSettingSchema = Type.Boolean();
 
 type SettingsReadContext = {
     cwd: string;
@@ -31,8 +32,13 @@ type SettingsReadContext = {
 };
 
 let settingsReadContext: SettingsReadContext | undefined;
-let cachedShowModeName: boolean | undefined;
-let cachedSettingsMtimeKey: string | undefined;
+let cachedSettings:
+    | {
+          mtimeKey: string;
+          showModeName: boolean;
+          useThinkingBorderColors: boolean;
+      }
+    | undefined;
 
 type ProjectTrustContext = ExtensionContext & {
     isProjectTrusted?: () => boolean;
@@ -52,8 +58,7 @@ export function setSettingsContext(ctx: ExtensionContext): void {
         settingsReadContext.projectTrusted !== next.projectTrusted
     ) {
         settingsReadContext = next;
-        cachedShowModeName = undefined;
-        cachedSettingsMtimeKey = undefined;
+        cachedSettings = undefined;
     }
 }
 
@@ -243,29 +248,62 @@ function updateSettingsObject(update: (settings: Record<string, unknown>) => voi
     });
 }
 
-function applyShowModeNameSetting(settings: Record<string, unknown>, fallback: boolean): boolean {
-    return (
-        parseOptionalBoolean(ShowModeNameSchema, settings[SHOW_MODE_NAME_SETTINGS_KEY]) ?? fallback
-    );
+function applyBooleanSetting(
+    settings: Record<string, unknown>,
+    key: string,
+    fallback: boolean,
+): boolean {
+    const parsed = parseOptionalBoolean(BooleanSettingSchema, settings[key]);
+    if (parsed === undefined) return fallback;
+    return parsed;
 }
 
-export function shouldShowModeName(): boolean {
+function readModeSettings(): {
+    showModeName: boolean;
+    useThinkingBorderColors: boolean;
+} {
     const mtimeKey = getSettingsMtimeKey();
-    if (cachedShowModeName !== undefined && cachedSettingsMtimeKey === mtimeKey) {
-        return cachedShowModeName;
+    if (cachedSettings?.mtimeKey === mtimeKey) {
+        return cachedSettings;
     }
 
     const context = settingsReadContext ?? { cwd: process.cwd(), projectTrusted: false };
     const manager = SettingsManager.create(context.cwd, getAgentDir(), {
         projectTrusted: context.projectTrusted,
     });
-    let show = false;
-    show = applyShowModeNameSetting(manager.getGlobalSettings() as Record<string, unknown>, show);
-    show = applyShowModeNameSetting(manager.getProjectSettings() as Record<string, unknown>, show);
+    let showModeName = false;
+    let useThinkingBorderColors = false;
+
+    const globalSettings = manager.getGlobalSettings() as Record<string, unknown>;
+    showModeName = applyBooleanSetting(globalSettings, SHOW_MODE_NAME_SETTINGS_KEY, showModeName);
+    useThinkingBorderColors = applyBooleanSetting(
+        globalSettings,
+        USE_THINKING_BORDER_COLORS_SETTINGS_KEY,
+        useThinkingBorderColors,
+    );
+
+    const projectSettings = manager.getProjectSettings() as Record<string, unknown>;
+    showModeName = applyBooleanSetting(projectSettings, SHOW_MODE_NAME_SETTINGS_KEY, showModeName);
+    useThinkingBorderColors = applyBooleanSetting(
+        projectSettings,
+        USE_THINKING_BORDER_COLORS_SETTINGS_KEY,
+        useThinkingBorderColors,
+    );
+
+    cachedSettings = {
+        mtimeKey,
+        showModeName,
+        useThinkingBorderColors,
+    };
+    return cachedSettings;
+}
 
-    cachedSettingsMtimeKey = mtimeKey;
-    cachedShowModeName = show;
-    return cachedShowModeName;
+export function shouldShowModeName(): boolean {
+    return readModeSettings().showModeName;
+}
+
+export function shouldUseThinkingBorderColors(): boolean {
+    return readModeSettings().useThinkingBorderColors;
 }
 
 export function setShowModeName(show: boolean): void {
@@ -273,6 +311,13 @@ export function setShowModeName(show: boolean): void {
         settings[SHOW_MODE_NAME_SETTINGS_KEY] = show;
     });
 
-    cachedSettingsMtimeKey = getSettingsMtimeKey();
-    cachedShowModeName = show;
+    cachedSettings = undefined;
+}
+
+export function setUseThinkingBorderColors(useThinkingBorderColors: boolean): void {
+    updateSettingsObject((settings) => {
+        settings[USE_THINKING_BORDER_COLORS_SETTINGS_KEY] = useThinkingBorderColors;
+    });
+
+    cachedSettings = undefined;
 }

package/src/types.ts

@@ -9,7 +9,8 @@ export type ModeSpec = {
     thinkingLevel?: ThinkingLevel;
     /**
      * Optional theme color token to use for the editor border.
-     * If unset, the border color is derived from the current thinking level.
+     * If unset, the default editor border is used unless thinking-derived
+     * border colors are enabled in settings.
      */
     color?: ThemeColor;
 };