@aphotic/pi-flow-ux
Optional UX layer for pi-flow: an always-on border-status editor, a custom startup header, the Nord theme, and a single unified /tui configuration (tui.json).
Package details
Install @aphotic/pi-flow-ux from npm and Pi will load the resources declared by the package manifest.
$ pi install npm:@aphotic/pi-flow-ux- Package
@aphotic/pi-flow-ux- Version
0.10.0- Published
- Jun 12, 2026
- Downloads
- 923/mo · 208/wk
- Author
- pangolinparty
- License
- MIT
- Types
- extension, theme
- Size
- 89.1 KB
- Dependencies
- 0 dependencies · 2 peers
Pi manifest JSON
{
"extensions": [
"extensions/index.ts"
],
"themes": [
"themes"
]
}Security note
Pi packages can execute code and influence agent behavior. Review the source before installing third-party packages.
README
@aphotic/pi-flow-ux
Optional UX layer for pi-flow: an always-on border-status editor, a custom startup header, the Nord theme, and a single unified /tui configuration (tui.json).
What this package provides
This package contains optional UX polish that extends the core pi-flow experience:
- Border-status editor — an always-on editor border that draws session metadata (activity, model, thinking level, context usage, and working directory)
- Custom startup header — a gradient pi logo with version and humanized startup reason, installed at session start
- Nord theme — a complete dark theme package tuned to the Nord color palette (https://www.nordtheme.com/)
- Unified TUI configuration — a single
tui.jsonconfig file and/tuicommand for all user-facing TUI settings
Standalone install and use
You can install @aphotic/pi-flow-ux as a standalone Pi package without the aggregate. Pi package sources must be one of: npm:<pkg>, a git URL (with git: prefix or a protocol URL), or a local/absolute path — bare names like "@aphotic/pi-flow-ux" are not valid sources.
Once the package is published to npm:
pi install npm:@aphotic/pi-flow-ux
For local development, install it directly from this monorepo checkout:
pi install /absolute/path/to/pi-flow/packages/pi-flow-ux
To trial it for a single Pi run without writing to settings, use -e with a valid source form:
pi -e npm:@aphotic/pi-flow-ux
pi -e /absolute/path/to/pi-flow/packages/pi-flow-ux
Or reference the package in your Pi settings.json using one of the supported source forms:
{
// pick one source form
"packages": ["npm:@aphotic/pi-flow-ux"]
// "packages": ["/absolute/path/to/pi-flow/packages/pi-flow-ux"]
}
After Pi loads the package, the following resources become available:
- Extensions: the unified UX entrypoint (
extensions/index.ts), which wires the border editor, custom header, and working coordinator - Themes:
nordtheme - Config defaults: packaged
tui.json(described below)
Border status
The border-status editor is always on. It draws session metadata directly into the editor border lines:
- Lower-left border: a fixed-width activity slot, then the model id, plus the thinking level when reasoning is enabled.
- Lower-right border: the
used/totalcontext-window token counts followed by the context percentage used, with the percentage as the rightmost value (e.g.9.3k/200k 12.3%). - Upper-right border: the working directory (with
~home substitution and tail truncation when long).
At narrow widths, optional fields degrade in priority order: the used/total token-window detail first, then the thinking level. The model id and context percentage are never dropped; the working directory is tail-truncated rather than dropped.
Because the border already carries model, context, and project metadata, Pi's built-in footer and host working row are suppressed while this package is installed.
Custom header
On session_start (when a UI is present), the package installs a custom header consisting of:
- A gradient pi logo wordmark
- A
version <VERSION>line - A humanized session-reason line (
hello,session reloaded,a fresh start,session resumed, orsession forked)
The header is installed via ctx.ui.setHeader and disposed on session_shutdown.
TUI configuration
All user-facing TUI options are configured through a single tui.json file and the /tui command.
Canonical shape
{
"version": 1,
"working": { "indicator": "wave" },
"header": {},
"editor": {},
"footer": {}
}
Working indicator
The working.indicator field controls the animation shape used in the activity slot. Valid values:
dot— static dotpulse— pulsing dotspinner— braille spinnerwave— braille wave (default)
Configuration resolution order
- User override:
~/.pi/agent/tui.json— takes precedence over all other tiers. - Packaged default:
node_modules/@aphotic/pi-flow-ux/tui.json— ships withworking.indicator: "wave". - Code default: hardcoded
working.indicator: "wave", used when both files are missing.
Failure semantics
- Missing or malformed user file → packaged default. No
~/.pi/agent/tui.json, or invalid JSON in it, falls back to the packaged default. - Missing packaged file → code default. A missing packaged
tui.jsonfalls back to hardcoded code defaults. - Malformed packaged JSON → throws. Invalid packaged JSON throws on startup so a broken release surfaces immediately.
The /tui command
/tui— reports current settings (e.g.TUI: working.indicator=wave)./tui working indicator=<dot|pulse|spinner|wave>— updates the indicator and persists the change atomically to~/.pi/agent/tui.json.
The user file is written in the canonical shape above. Any unrecognized top-level keys already in the user file are preserved.
Aggregate install and use
@aphotic/pi-flow is the recommended aggregate package that includes @aphotic/pi-flow-ux resources forwarded through node_modules/@aphotic/pi-flow-ux/. Install the aggregate via Pi to get UX resources alongside workflow skills:
pi install npm:@aphotic/pi-flow
# or, for local development from this monorepo:
pi install git:github.com/davidsunglee/pi-flow
pi install /absolute/path/to/pi-flow
The aggregate forwards UX resources automatically through its pi manifest:
{
"extensions": ["node_modules/@aphotic/pi-flow-ux/extensions/index.ts"],
"themes": ["node_modules/@aphotic/pi-flow-ux/themes/nord.json"]
}
Nord theme activation
The Nord theme is discoverable by Pi after the package is loaded. To activate it, either pick it interactively via /settings inside Pi, or set it persistently in Pi settings.json:
{
"theme": "nord"
}
Pi has no pi theme subcommand — theme selection is always via the theme setting (interactively through /settings, or by editing settings.json directly). See the Pi themes docs for details.
Pi discovers the theme by scanning the node_modules/@aphotic/pi-flow-ux/themes/ directory for theme definitions named nord.json.
Minimal/headless use
If you prefer the workflow skills without UX enhancements, install @aphotic/pi-flow-core directly instead, using one of Pi's supported source forms:
pi install npm:@aphotic/pi-flow-core
# or, for local development from this monorepo checkout:
pi install /absolute/path/to/pi-flow/packages/pi-flow-core
@aphotic/pi-flow-core is the independent skill package with no theme, footer, working indicator, or packaged defaults—suitable for headless, script-driven, or minimal CLI environments.