跳到正文
cccskills
免费在 GitHub 公开

boring-ui

Entry point for building with Boring UI (the @hachej/boring-* npm packages and shadcn registry blocks for apps with an AI agent inside, on the Pi agent harness). Use when a task mentions boring-ui, @hachej/boring-ui-kit, @hachej/boring-agent, @hachej/boring-files, boring-ui-blocks, PiChat, AgentWorkspace, AmbientChat, AppShell, or asks to "add an agent/assistant/chat to my app", "build an app with an agent inside", or "use the Boring kit". Explains the packages, the rules every change must follow, and which boring-ui skill to load next.

中文简介正在准备中。当前显示原文说明。

hachej/boring-ui

实测评分 未实测

查看安装方法

包含的文件（1）

  • SKILL.md5.1 KB

SKILL.md（原文）

安装前可以查看交给 AI 代理的指令内容。

Boring UI

Boring UI is a kit for putting an AI agent inside an app. It has two halves:

  • npm packages for the server and headless browser code.
  • shadcn registry blocks (React source copied into the app) for the UI.

The agent runs on Pi (@earendil-works/pi-durable). The app's server opens Pi's Harness; the kit adds agent definitions, tools and HTTP handlers around it.

Pick the next skill

The taskLoad
Create an app with an agent, or add an agent to an existing React/Node appbuild-agent-app
Install, update, restyle or check UI blocksadd-blocks
Give the agent tools, file access, approvals, questions, sub-agents or schedulesagent-capabilities

Packages

Keep all @hachej/boring-* packages on the same version. Pi packages are peers pinned to ~1.2.0.

PackageUse it for
@hachej/boring-ui-kitHeadless controllers, editors and viewers; the registry items under r/; the boring-ui-blocks command
@hachej/boring-agentdefineAgent (/agents), chat transport (/chat-transport), conversations (/conversations), present (/artifacts), file guard (/file-guard), approvals (/approval), questions (/ask-user), schedules (/schedule), memory (/memory/optchat)
@hachej/boring-filesThe workspace provider (/workspace), its journal (/journal, /sqlite), the browser revision provider (/revision) and its handler (/revision-handler), Node HTTP glue (/node-http)
@hachej/boring-executionVirtual Bash and Git (/virtual, /virtual-git), remote shell and file system adapters
@hachej/boring-feedbackIn-app feedback capture and delivery
@earendil-works/pi-durable, pi-ai, chordPi itself: Harness, createRegistry, defineTool, storage, NodeExecutionEnv, models, context

Main blocks: pi-chat (the conversation), pi-ambient (a floating bar over an existing site), pi-workspace (chat plus an artifact panel), pi-app (a whole agent page: sessions, chat, viewers), app-shell (one agent above any app, phone drawer and desktop panel). The full list is in registry/README.md.

Rules

Follow these on every change. They come from INVARIANTS.md and AGENTS.md.

  1. The host owns the Harness. The app's server opens and closes Pi's Harness, its storage, its models and its credentials. Kit packages never open one. Do not wrap Pi in a new engine, registry or scheduler; use Pi's public APIs (defineTool, defineExtension, registry.install, conversation.configure).
  2. The host owns policy. Authentication, who may open which conversation or file, budgets and model keys live in host code (the authenticate and resolve callbacks of the handlers). Never put a model key in browser code.
  3. One place for files. Each workspace has exactly one provider instance (createWorkspaceProvider). The agent's file tools (through createFileGuard), present, the viewers and the file tree all use that same instance. No second copy, mirror or sync.
  4. Use blocks, not hand-rolled UI. Install the registry blocks and customise them through their props (labels, icons, headerActions, artifactKinds, viewers, renderTool, …) and the shadcn theme tokens. Never edit an installed block file; npx boring-ui-blocks check fails on edited copies.
  5. Agent-written code never runs in the host process. An agent may run code only through its conversation's ExecutionEnv (a shell or sandbox). Do not import() or eval workspace content.
  6. Fictional data only in examples, fixtures, seeds and tests. Never use real people, credentials or customer data.

Where to read more

Verify

  • The kit version: npm view @hachej/boring-ui-kit version. Use it for every @hachej/boring-* package and every registry URL.
  • In an app with blocks: npx boring-ui-blocks check --design src passes.
  • In this repository: npm run check passes.

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护，适用 Google 的隐私权政策和服务条款。

同一仓库的技能

add-blocks

免费

Find, install, update, check and theme Boring UI registry blocks (shadcn items such as pi-chat, pi-ambient, pi-workspace, pi-app, app-shell, viewers, file-tree, documents, feedback, windows) with the boring-ui-blocks command. Use when asked to "add a chat/agent block", "install pi-app", "upgrade/update the Boring blocks", "boring-ui-blocks check fails", "blocks edited", "restyle/rebrand the agent UI", "change the chat labels/icons/actions", "dark mode for the chat", or when tempted to edit a file under src/components/pi-*.

中文简介正在准备中。当前显示原文说明。

hachej/boring-ui492026年10月23日 更新

agent-capabilities

免费

Give a Boring UI in-app agent capabilities and gate them safely - custom tools, workspace file access (file guard, present), Approve/Deny approvals, ask_user questions, sub-agents (delegate), schedules, sandboxes and self-evolving tools. Use when asked to "add a tool to the agent", "let the agent edit files", "require approval before X", "ask the user a question", "add a sub-agent/delegate", "schedule a follow-up/reminder", "dry-run/sandbox the agent", "let the agent write its own tools", or when choosing which tools to gate with requireApproval or createApprovalExtension.

中文简介正在准备中。当前显示原文说明。

hachej/boring-ui492026年10月23日 更新

boring-pm

免费

The domain expert's product manager in a project repository run by the Boring Factory. Use when the expert brings a need or an idea, wants to clarify, change or resume a feature ("reprends la fiche"), asks what is happening with a feature, has a builder's question to answer, or has a preview to try and accept. Interviews one question at a time, writes the contract and mockups on the contract pull request, and submits the expert's approval only after the expert confirms. Never writes code.

中文简介正在准备中。当前显示原文说明。

hachej/boring-ui492026年10月23日 更新

build-agent-app

免费

Build a React + Node app with an AI agent inside using Boring UI, or add one to an existing app. Use when asked to "create an agent app", "add an AI assistant/chat/copilot to my app", "scaffold a Boring UI app", "wire AgentWorkspace/PiChat to a server", "set up the Pi Harness with the kit", or to connect the pi-app, pi-chat or pi-ambient blocks to defineAgent, createChatTransportHandler, createConversationsHandler and createRevisionHandler. Gives the verified smallest setup (one Node server, one page) and how to extend it.

中文简介正在准备中。当前显示原文说明。

hachej/boring-ui492026年10月23日 更新

查看 hachej 的全部技能

报告此技能的问题