npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@failed-to-load/pi-webui

v0.1.8

Published

Web UI bridge for Pi coding agent — exposes the agent session over HTTP/WebSocket so a browser extension (or any HTTP+WS client) can drive the TUI.

Readme

pi-webui — Pi 扩展(中文)

认可linux.do

🇬🇧 English version: README.md

一个 Pi 扩展,把活跃的 pi 会话桥接到本地 HTTP + WebSocket 服务器。配合 browser-extension/ 侧边栏使用,可以在 Chrome 中完全驱动 pi agent。

它做什么

  • 默认监听 http://127.0.0.1:9777
  • 使用一套简洁的 JSON 协议(见 src/types.ts)。
  • 通过 WebSocket 转发每一个 pi 会话事件(消息更新、工具调用、模型切换、压缩、会话切换……)。
  • 接收 prompt / steer / follow-up / abort / 模型 / 思考 / 工具 / 会话操作 等请求。
  • 提供一组 REST 端点作为一次性客户端的备用入口。

安装

npm install

到此为止。Pi 通过 package.jsonpi.extensions 字段自动发现扩展。

启动

npx pi

网桥就绪后会打印横幅。如果不想启动网桥,设置 PI_WEBUI_DISABLE=1

环境变量

| 变量 | 默认值 | 含义 | | --- | --- | --- | | PI_WEBUI_PORT | 9777 | TCP 端口 | | PI_WEBUI_HOST | 127.0.0.1 | 绑定地址。设为 0.0.0.0 会暴露到所有网卡 | | PI_WEBUI_DISABLE | 未设置 | 设为 1 完全跳过网桥启动 |

模块结构

src/
├── types.ts     ← 协议消息类型
├── server.ts    ← HTTP + WebSocket 传输层(不知道 pi 的存在)
├── bridge.ts    ← 扩展 API 适配层(懂 pi,但不开 socket)
└── index.ts     ← 把两边接起来,并注册扩展

这种拆分是刻意的:server.ts 从不 import pi,bridge.ts 从不创建 socket,index.ts 是唯一同时认识两者的入口。替换其中一侧时另一侧无需改动。

会话塑形操作的处理方式

new_sessionforkcompactswitch_session 这些操作只存在于 ExtensionCommandContext,普通的 ExtensionContext 没有——也就是说只能在斜杠命令处理器内部调用。网桥通过以下方式绕过这个限制:

  1. 注册一个隐藏的 /webui-do 斜杠命令。
  2. 网桥通过 webui:do 事件发送带 requestId 的操作负载。
  3. 命令处理器解析负载、调用对应的 ctx.newSession() / ctx.fork() / ctx.switchSession(),并通过 webui:response 事件回传结果(按 requestId 匹配)。
  4. 10 秒超时保护,防止回执丢失时无限等待。

许可证

MIT。详见 package.json