@oh-my-pi/pi-tui 15.2.1 → 15.2.3

package/CHANGELOG.md

@@ -2,6 +2,15 @@
 
 ## [Unreleased]
 
+## [15.2.3] - 2026-05-22
+### Added
+
+- Added `SettingsList#setItems` to replace the entire settings list with a new items array while automatically clamping selection to a valid index
+
+### Changed
+
+- Updated `Loader` to drive renders at ~60fps (16ms tick) while keeping spinner-frame advancement at 80ms so shimmer/animated message colorizers update smoothly without altering spinner cadence
+
 ## [15.1.9] - 2026-05-21
 
 ### Fixed

package/dist/types/components/loader.d.ts

@@ -1,8 +1,5 @@
 import type { TUI } from "../tui";
 import { Text } from "./text";
-/**
- * Loader component that updates every 80ms with spinning animation
- */
 export declare class Loader extends Text {
     #private;
     private spinnerColorFn;

package/dist/types/components/settings-list.d.ts

@@ -25,6 +25,14 @@ export declare class SettingsList implements Component {
     constructor(items: SettingItem[], maxVisible: number, theme: SettingsListTheme, onChange: (id: string, newValue: string) => void, onCancel: () => void);
     /** Update an item's currentValue */
     updateValue(id: string, newValue: string): void;
+    /**
+     * Replace the entire items array. Selection is preserved when the prior
+     * index is still valid, otherwise clamped to the last item (or 0 if the
+     * list is now empty). An open submenu is left untouched — its lifetime
+     * is bounded by its own done callback, and `#closeSubmenu` re-clamps the
+     * restored index against the new list on the way out.
+     */
+    setItems(items: SettingItem[]): void;
     invalidate(): void;
     render(width: number): string[];
     handleInput(data: string): void;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"type": "module",
 	"name": "@oh-my-pi/pi-tui",
-	"version": "15.2.1",
+	"version": "15.2.3",
 	"description": "Terminal User Interface library with differential rendering for efficient text-based applications",
 	"homepage": "https://omp.sh",
 	"author": "Can Boluk",
@@ -37,8 +37,8 @@
 		"fmt": "biome format --write ."
 	},
 	"dependencies": {
-		"@oh-my-pi/pi-natives": "15.2.1",
-		"@oh-my-pi/pi-utils": "15.2.1",
+		"@oh-my-pi/pi-natives": "15.2.3",
+		"@oh-my-pi/pi-utils": "15.2.3",
 		"lru-cache": "11.3.6",
 		"marked": "^18.0.3"
 	},

package/src/components/loader.ts

@@ -3,13 +3,27 @@ import { sliceByColumn, visibleWidth } from "../utils";
 import { Text } from "./text";
 
 /**
- * Loader component that updates every 80ms with spinning animation
+ * Loader component that drives display refresh at ~60fps so callers whose
+ * message colorizer is time-dependent (e.g. shimmer/KITT) animate smoothly.
+ *
+ * Two cadences are interleaved on a single timer:
+ *   - **Render tick** (every `RENDER_INTERVAL_MS`) → asks the TUI to redraw.
+ *     The TUI already throttles at 16ms (`MIN_RENDER_INTERVAL_MS`), so this
+ *     is the natural upper bound; static messageColorFns produce identical
+ *     output and the differ drops the no-op redraw at ~zero cost.
+ *   - **Spinner advance** (every `SPINNER_ADVANCE_MS`) → bumps the spinner
+ *     frame index. Decoupled from the render cadence so the spinner keeps
+ *     its classic ~12.5fps step pace regardless of shimmer state.
  */
+const RENDER_INTERVAL_MS = 16;
+const SPINNER_ADVANCE_MS = 80;
+
 export class Loader extends Text {
 	#frames = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
 	#currentFrame = 0;
 	#intervalId?: NodeJS.Timeout;
 	#ui: TUI | null = null;
+	#lastSpinnerTick = 0;
 
 	constructor(
 		ui: TUI,
@@ -38,11 +52,16 @@ export class Loader extends Text {
 	}
 
 	start() {
+		this.#lastSpinnerTick = performance.now();
 		this.#updateDisplay();
 		this.#intervalId = setInterval(() => {
-			this.#currentFrame = (this.#currentFrame + 1) % this.#frames.length;
+			const now = performance.now();
+			if (now - this.#lastSpinnerTick >= SPINNER_ADVANCE_MS) {
+				this.#currentFrame = (this.#currentFrame + 1) % this.#frames.length;
+				this.#lastSpinnerTick = now;
+			}
 			this.#updateDisplay();
-		}, 80);
+		}, RENDER_INTERVAL_MS);
 	}
 
 	stop() {

package/src/components/settings-list.ts

@@ -59,6 +59,22 @@ export class SettingsList implements Component {
 		}
 	}
 
+	/**
+	 * Replace the entire items array. Selection is preserved when the prior
+	 * index is still valid, otherwise clamped to the last item (or 0 if the
+	 * list is now empty). An open submenu is left untouched — its lifetime
+	 * is bounded by its own done callback, and `#closeSubmenu` re-clamps the
+	 * restored index against the new list on the way out.
+	 */
+	setItems(items: SettingItem[]): void {
+		this.#items = items;
+		if (this.#items.length === 0) {
+			this.#selectedIndex = 0;
+		} else if (this.#selectedIndex >= this.#items.length) {
+			this.#selectedIndex = this.#items.length - 1;
+		}
+	}
+
 	invalidate(): void {
 		this.#submenuComponent?.invalidate?.();
 	}