Clearance

Inspiration

OpenAI killed Instant Checkout in March 2026 after a Walmart test showed ~3x worse conversion: people do not trust an agent to spend their money without guardrails. Forrester (Apr 2026) found ~75% of US/UK/CA adults uncomfortable letting agents complete purchases even WITH spending limits. The missing piece was never a smarter agent - it was visible governance living where the shopping happens. The W3C WebMCP spec even names this gap (Section 6.3.2.3 'Ambiguous Finalization') and lists it as unsolved in 6.3.2.4. Clearance is a working answer.

What it does

Clearance is an agent-native storefront. Your AI agent can search, compare, and build a cart - but a server-side rules engine gates every purchase against limits YOU set on the page: a monthly envelope, a per-purchase cap, an approval threshold, category whitelists, and a merchant blocklist. Over the cap, the agent's checkout call PAUSES and an in-page approval card appears showing exactly which rule fired and why the agent chose this item. Approve and it executes; reject and it stops. Every action lands in a SHA-256 hash-chained receipt ledger, and any purchase can be undone within 5 minutes - the 'escape hatch' Consumer Reports says every agentic-commerce provider must build under UETA 10(b).

How we built it

TanStack Start (React 19) + Tailwind v4 + PGlite (server-side embedded Postgres) for the store, rules engine, and ledger. The agent surface is the native WebMCP API: 8 tools registered via document.modelContext.registerTool, with readOnly/untrustedContent/humanInTheLoop annotations. checkout_purchase uses requestUserInteraction to pause for human approval; @mcp-b/global polyfills the same tools into any browser when native WebMCP is absent. One shared rules engine governs both human clicks and agent calls - there is no separate, weaker 'agent lane'.

Challenges we ran into

Designing approval UX that prevents both false approvals and alert fatigue: auto-execute inside the envelope silently (no nagging), gate only over the cap, and add a hold-to-confirm for >$200 purchases (Nielsen Norman Group guidance on rubber-stamping). A rubber-stamp guard watches the approve-rate and warns if you approve everything and reverse nothing. Making the ledger tamper-evident with a live /api/verify endpoint was straightforward but was the differentiator judges noticed.

Accomplishments that we're proud of

The end-to-end loop is real: agent calls checkout over WebMCP, the page pauses, a human approves on the card, the receipt is written to a hash chain, and the human can undo within the window. We also nailed the spec a head-of-time: humanInTheLoopHint and untrustedContentHint predate their own proposal, mapping to webmcp issue #198 and Chrome's agent-content guidance.

What we learned

Governance has to be first-class UI, not a backend API. Stripe's Machine Payments Protocol already has our exact rule types - but ships them as a backend API nobody wraps in a consumer surface. The merchant page is the right place for the human-agent contract because that is where the spend actually happens.

What's next

Deploy to Netlify, add multi-agent shared ledgers, and richer declarative form-tools for the approval step. Longer term: let merchants recognize a governed-agent session and surface the consumer's own rules, closing the loop between shopper intent and checkout.

Built With

• agentic-commerce
• ai-agents
• human-in-the-loop
• pglite
• react
• tanstack-start
• typescript
• webmcp