القائمة
Build or modify Fleet Pi's React Agent Elements UI, including InputBar controls, tool cards, question prompts, resource drawer, model picker, mode selector, and streaming state.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
Build generative UI apps with OpenUI and OpenUI Lang — the token-efficient open standard for LLM-generated interfaces. Use when mentioning OpenUI, @openuidev, generative UI, streaming UI from LLMs, component libraries for AI, or replacing json-render/A2UI. Covers scaffolding, defineComponent, system prompts, the Renderer, and debugging OpenUI Lang output.
Map the Fleet Pi codebase before planning or editing. Use when asked what the app does, where chat/session/resource code lives, or how the monorepo fits together.
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
Diagnose Fleet Pi chat runtime failures, including NDJSON streams, Pi sessions, Bedrock model errors, resource loader diagnostics, queueing, aborts, and Plan mode question flow.
استنادا إلى تصنيف SOC المهني
| name | agent-ui-workflows |
| description | Build or modify Fleet Pi's React Agent Elements UI, including InputBar controls, tool cards, question prompts, resource drawer, model picker, mode selector, and streaming state. |
Use this skill for UI changes in the chat surface or shared Agent Elements package.
apps/web/src/routes/index.tsxpackages/ui/src/components/agent-elements/chat-types.tspackages/ui/src/components/agent-elements/input-bar.tsxpackages/ui/src/components/agent-elements/input/packages/ui/src/components/agent-elements/tools/tool-renderer.tsxpackages/ui/src/components/agent-elements/tools/tool-registry.tspackages/ui/src/components/agent-elements/question/aria-label and title for compact actions.InputBar mode/model controls inside leftActions.apps/web/src/routeTree.gen.ts manually.pnpm --filter web typecheck
pnpm --filter @workspace/ui typecheck
pnpm --filter web lint
pnpm --filter @workspace/ui lint