skills.rest
012e
012eCOMMUNITY
Explore all skills by this author →
GitHub

tools

Register frontend and backend tools with UI renderers for LLM assistants.

1|Updated Feb 14, 2026
Search Tags:#frontend#react#llm#tools#human-in-the-loop#tool-definition#tool-ui
One-click install
npx skills add https://github.com/012e/thesis --skill tools-012e
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tools
Source: https://github.com/012e/thesis/tree/main/.agents/skills/tools
Command: npx skills add https://github.com/012e/thesis --skill tools-012e

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Developers need a scalable way to register reusable tools that execute in the browser and render custom UI for tool calls in LLM-powered assistants. This skill provides a standardized approach to define tools (name, parameters, execute), attach UI renderers, and enable human-in-the-loop interactions within the same runtime.

Core Features & Use Cases

  • Registers tools in the frontend using makeAssistantTool and exposes an execution pipeline that can stream results.
  • Renders interactive UIs for tool calls with makeAssistantToolUI and supports human-in-the-loop confirmation patterns.
  • Supports multiple tools and UI components (hooks, conditional registration, and frontend-only tools) to build rich assistant workflows.
  • Use Case: Build a virtual assistant that can call a weather tool, search tool, or data processor and present results in a cohesive UI with optional user confirmations.

Quick Start

Register a new tool with makeAssistantTool and render its UI using makeAssistantToolUI in your assistant app.

Frequently Asked Questions about tools

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I register browser tools for LLMs and render custom UI for tool calls?▼

To register browser tools for LLMs and render custom UI, use makeAssistantTool to define executable functions and makeAssistantToolUI to attach interactive renderers within your assistant app.

Does this tool registration approach support human-in-the-loop confirmation patterns?▼

Yes, human-in-the-loop confirmation patterns are supported. The UI renderers allow users to review and confirm actions before the streaming execution pipeline proceeds with tool calls.

What is the best way to execute multiple tools with streaming results in a React frontend?▼

The best way to execute multiple tools with streaming results in a React frontend is registering them via makeAssistantTool and exposing the execution pipeline to stream outputs directly in the browser.

Can I define frontend-only tools for LLM assistants without a backend?▼

Yes, frontend-only tools can be defined without a backend. The system supports conditional registration to build rich assistant workflows entirely in the browser.

How does error handling and cancellation work for streaming tool execution?▼

Error handling and cancellation for streaming tool execution are managed safely within the pipeline. The system enforces tool metadata and optional resources to ensure processes halt correctly upon errors.

Related Skills

Explore More Software Engineering Skills→
Gentleman-ProgrammingGentleman-Programming
618

ai-sdk-5

Integrate Vercel AI SDK 5 chat features in React apps.

Official
Intermediate
googlegoogle
455

uiblocks

Design interactive 3D user interfaces for XR Blocks with Three.js and uikit.

Official
Advanced
databricks-solutionsdatabricks-solutions
1.8k

databricks-app-apx

Builds full-stack Databricks applications with FastAPI backend and React frontend.

Official
Advanced
hasnahasna

shadcn

Integrates reusable UI components into your Tailwind and React projects via the managed screen reader.

Official
Intermediate