pi-one-ui 0.3.1 → 0.4.0

package/extensions/layouts/working-line/working-line.ts

@@ -550,7 +550,12 @@ export type WorkingLineRuntimeSegments = {
   tool?: string;
   elapsedMs?: number;
   thought?: { durationMs: number; active: boolean };
-  tokens?: { input: number; output: number; outputApproximate?: boolean };
+  tokens?: {
+    input: number;
+    output: number;
+    outputApproximate?: boolean;
+    outputTokensPerSecond?: number;
+  };
 };
 
 export type WorkingLineFrameState = {
@@ -617,11 +622,18 @@ export function formatWorkingLineTokens(
     tokens.input < 0 ||
     tokens.output < 0 ||
     (tokens.outputApproximate !== undefined &&
-      typeof tokens.outputApproximate !== "boolean")
+      typeof tokens.outputApproximate !== "boolean") ||
+    (tokens.outputTokensPerSecond !== undefined &&
+      (!Number.isFinite(tokens.outputTokensPerSecond) ||
+        tokens.outputTokensPerSecond < 0))
   ) {
     return undefined;
   }
-  return `↑${formatCount(tokens.input)} ↓${formatCount(tokens.output)}`;
+  const outputRate =
+    tokens.outputTokensPerSecond && tokens.outputTokensPerSecond > 0
+      ? ` ⚡${formatCount(Math.round(tokens.outputTokensPerSecond * 10) / 10)} tok/s`
+      : "";
+  return `↑${formatCount(tokens.input)} ↓${formatCount(tokens.output)}${outputRate}`;
 }
 
 function truncateWithEllipsis(value: string, capacity: number): string {
@@ -1174,6 +1186,15 @@ export class WorkingLineController {
   startTurn(ctx: WorkingLineContext): WorkingLineReconcileResult {
     const config = this.getConfig().components.workingLine;
     this.activeTools.clear();
+    if (this.tokens?.outputTokensPerSecond !== undefined) {
+      this.tokens = {
+        input: this.tokens.input,
+        output: this.tokens.output,
+        ...(this.tokens.outputApproximate === undefined
+          ? {}
+          : { outputApproximate: this.tokens.outputApproximate }),
+      };
+    }
     const selectedMessage = selectWorkingLineMessage(config, this.random);
     if (!config.enabled) {
       this.selectedMessage = selectedMessage;

package/extensions/shared/icons.ts

@@ -23,7 +23,6 @@ export type IconGlyphs = {
   deleted: string;
   typechanged: string;
   cacheHit: string;
-  editorPrompt: string;
   rail: string;
   username: string;
   time: string;
@@ -48,7 +47,6 @@ export const ICON_GLYPH_KEYS = [
   "deleted",
   "typechanged",
   "cacheHit",
-  "editorPrompt",
   "rail",
   "username",
   "time",
@@ -79,7 +77,6 @@ export const NERD_DEFAULT_ICONS: IconGlyphs = {
   deleted: "✘",
   typechanged: "T",
   cacheHit: "󰆼",
-  editorPrompt: "",
   rail: "│",
   username: "",
   time: "",
@@ -103,7 +100,6 @@ export const ASCII_DEFAULT_ICONS: IconGlyphs = {
   deleted: "x",
   typechanged: "T",
   cacheHit: "c",
-  editorPrompt: "",
   rail: "|",
   username: "@",
   time: "t",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-one-ui",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "description": "A single, customizable Pi UI package with layout-oriented Context and Shell rendering for Pi.",
   "type": "module",
   "license": "MIT",
@@ -58,8 +58,7 @@
     "themes": [
       "./themes/cc-dark.json",
       "./themes/cc-light.json"
-    ],
-    "image": "https://raw.githubusercontent.com/minuque/pi-cc-extensions/main/assets/readme/preview.png"
+    ]
   },
   "devDependencies": {
     "@biomejs/biome": "^2.5.5",

package/extensions/layouts/editor/accent-rail-editor.ts

@@ -1,112 +0,0 @@
-import type { Theme } from "@earendil-works/pi-coding-agent";
-import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
-import type { ZentuiConfig } from "../../app/config/shell.ts";
-import {
-  renderStyleForSourceOrFallback,
-  type SourceStyleFallback,
-} from "../../shared/style.ts";
-import {
-  applyOwnedLayoutBackground,
-  fillTerminalLine,
-  renderCompletionRows,
-} from "./completion-menu.ts";
-import { sanitizeEditorMetadataText } from "./editor-metadata-format.ts";
-
-export const ACCENT_RAIL_CHROME_WIDTH = 2;
-
-const ACCENT_RAIL_FALLBACK: SourceStyleFallback = {
-  theme: "syntaxNumber",
-  terminal: "fg:215",
-};
-
-export type AccentRailViewport = {
-  above?: string;
-  below?: string;
-};
-
-export type AccentRailEditorFrameOptions = {
-  width: number;
-  editorLines: string[];
-  autocompleteLines?: string[];
-  viewport?: AccentRailViewport;
-  uiTheme: Theme;
-  config: ZentuiConfig;
-};
-
-function clampLines(lines: string[], width: number): string[] {
-  const maxWidth = Math.max(0, width);
-  return lines.map((line) => truncateToWidth(line, maxWidth, ""));
-}
-
-function selectedRail(config: ZentuiConfig): string {
-  const style = config.components.editor.styles["accent-rail"];
-  const fallback = config.icons.mode === "ascii" ? "|" : "▎";
-  const configured =
-    config.icons.mode === "ascii" ? style.asciiRail : style.rail;
-  const sanitized = sanitizeEditorMetadataText(configured);
-  const glyph = truncateToWidth(sanitized, 1, "");
-  return visibleWidth(glyph) === 1 ? glyph : fallback;
-}
-
-function viewportLabel(
-  direction: "above" | "below",
-  count: string | undefined,
-): string | undefined {
-  if (!count || !/^[1-9]\d*$/.test(count)) return undefined;
-  return `${direction === "above" ? "↑" : "↓"} ${count} more`;
-}
-
-/** Pure compact accent-rail composition shared by live rendering and settings previews. */
-export function renderAccentRailEditorFrame({
-  width,
-  editorLines,
-  autocompleteLines = [],
-  viewport = {},
-  uiTheme,
-  config,
-}: AccentRailEditorFrameOptions): string[] {
-  if (width < ACCENT_RAIL_CHROME_WIDTH + 1) {
-    return clampLines([...editorLines, ...autocompleteLines], width);
-  }
-
-  const contentWidth = width - ACCENT_RAIL_CHROME_WIDTH;
-  const rail = renderStyleForSourceOrFallback(
-    uiTheme,
-    config.components.editor.colorSource,
-    config.colors.editorRail,
-    ACCENT_RAIL_FALLBACK,
-    selectedRail(config),
-  );
-  const above = config.components.editor.viewportIndicators
-    ? viewportLabel("above", viewport.above)
-    : undefined;
-  const below = config.components.editor.viewportIndicators
-    ? viewportLabel("below", viewport.below)
-    : undefined;
-  const rows = [
-    ...(above ? [above] : []),
-    ...editorLines,
-    ...(below ? [below] : []),
-  ];
-  const transparent =
-    config.components.editor.styles["accent-rail"].transparent;
-  const layout = rows.map((line) => {
-    const railCell = transparent
-      ? rail
-      : applyOwnedLayoutBackground(uiTheme, rail);
-    const bodyText = ` ${fillTerminalLine(line, contentWidth)}`;
-    const body = transparent
-      ? bodyText
-      : applyOwnedLayoutBackground(uiTheme, bodyText);
-    return `${railCell}${body}`;
-  });
-  const autocompleteLayout = renderCompletionRows({
-    lines: autocompleteLines,
-    width,
-    theme: uiTheme,
-    selectedPrefix: `${rail} `,
-    ownedBackground: !transparent,
-  });
-
-  return clampLines([...layout, ...autocompleteLayout], width);
-}