WebMCP Kit

Demo guide

Natural language becomes safe, typed app actions.

11 routes show the same contract from different angles: current page context, narrow tools, a durable Pi conversation, app-owned execution, and approval for sensitive changes.
01

Online shop

Browse a familiar storefront, build the same cart by hand or through the assistant, and finish a simulated checkout. The cart survives reloads in the same tab.

Command
Find a backpack under €60, add it to my cart, and open checkout.
Expected tool call
search_products({ query: "backpack", maxPrice: 60 }) → add_to_cart({ revision, productId: "backpack", quantity: 1 }) → initiate_checkout({ revision })
Safety boundary
The app owns prices, stock and totals. Cart changes need the current revision. Checkout opens a review; only the shopper can click Place demo order. No payment is taken and nothing is shipped.
Open Online shop
02

Customer requests

Read what customers mean. Select the right requests, then prepare replacements.

Command
Find customers whose items arrived physically broken and who want replacements. Leave refund requests and missing-parts requests alone.
Expected tool call
read_workflow({}) → assess_workflow({ revision, request }) → create_replacement_cases({ revision, ids }) after an explicit action request
Safety boundary
Source and request changes invalidate old selections. Final actions require current assessment results, eligibility, and confirmation.
Open Customer requests
03

Shopping by intent

Describe your day. Compare headphones against the way you will use them.

Command
Headphones for long work calls in a noisy shared office. Music quality is not my priority.
Expected tool call
read_workflow({}) → assess_workflow({ revision, request }) → add_shortlist_to_cart({ revision, ids }) after an explicit action request
Safety boundary
Source and request changes invalidate old selections. Final actions require current assessment results, eligibility, and confirmation.
Open Shopping by intent
04

Evidence review

Compare each claim with its source. Open the mismatch and request better evidence.

Command
Check whether each source supports its claim. Select claims that need another look.
Expected tool call
read_workflow({}) → assess_workflow({ revision, request }) → request_better_evidence({ revision, ids }) after an explicit action request
Safety boundary
Source and request changes invalidate old selections. Final actions require current assessment results, eligibility, and confirmation.
Open Evidence review
05

Guided help

Describe what happened. The next step changes with the meaning of your problem.

Command
Tracking says delivered, but nothing arrived.
Expected tool call
read_workflow({}) → assess_workflow({ revision, request }) → submit_help_request({ revision, ids, helpDetails }) after an explicit action request
Safety boundary
Source and request changes invalidate old selections. Final actions require current assessment results, eligibility, and confirmation. Ask for the selected process details before submitting.
Open Guided help
06

Launch triage

Turn impact, frustration, team, and clarity judgments into a reviewable queue before assigning work.

Command
Assess the launch queue and show which reports need attention.
Expected tool call
read_launch_room({}) → assess_launch_queue({})
Safety boundary
Assignment requires an unchanged report, a current assessment, routing thresholds, and confirmation. Reweighting is local; edited reports need reassessment.
Open Launch triage
07

Inventory

A SaaS page can expose useful AI actions without handing over global app control.

Command
Select all French items
Expected tool call
select_items({ ids: [...] })
Safety boundary
Pi cannot invent invoice, cart, or ticket actions on this route.
Open Inventory
08

Invoices

Agentic workflows can be useful while still respecting approval gates for sensitive records.

Command
Mark Stark Industries invoices as paid
Expected tool call
select_invoices(...) -> update_selected_invoice_status({ ids: [...], status: "paid" })
Safety boundary
Confirmation is enforced per mutating tool, including inside chained tool calls.
Open Invoices
09

Commerce

The demo shows blocked actions as a feature: app rules remain authoritative.

Command
Add 20 keyboard kits to the cart
Expected tool call
add_to_cart({ productId: "kbd-01", quantity: 20 })
Safety boundary
Cart quantities cannot exceed available stock, and checkout requires approval.
Open Commerce
10

Flights

Travel products can expose useful search and choice workflows while keeping checkout out of scope.

Command
Find Lisbon to London flights and select the cheapest morning direct option
Expected tool call
search_flights(...) -> select_flight({ id: "flight_lis_lhr_0830" })
Safety boundary
The app selects an itinerary candidate only; no passenger, payment, or booking action exists.
Open Flights
11

Support

Teams can make ordinary forms and queues agent-callable without rebuilding the product.

Command
Create a support ticket
Expected tool call
create_support_ticket({ subject, body })
Safety boundary
The app owns the form fields, validation, and created ticket record.
Open Support