Uai

Overview

Uai is a library of compound shadcn components and page blocks with motion and micro-interactions built in. The site lists 112 items, 71 components and 41 blocks, which are copied into a project with the shadcn CLI. The name comes from the Minas Gerais word for surprise, and it is pronounced like "why".

Beyond the usual marketing and app UI, Uai covers two less common areas: AI agent interfaces, such as thinking states, tool calls, agent questions, approvals and a context meter, and Brazilian commerce, with a document field, CEP postal code field, Pix, Pix Automático, boleto payments and installment pickers. Components use class-variance-authority for variants and lucide-react icons, with a dedicated Uai theme.

Features

• AI interface: Thinking, message, citation, attachment, tool call, response status, run summary, prompt composer and agent run blocks.
• Brazilian commerce: Document field, CEP field, Pix payment, Pix Automático, boleto payment and installment picker.
• Commerce: Coupon field, quantity picker, cart drawer, checkout, order tracking and subscription management.
• Marketing: Hero, feature showcase, pricing, testimonials, FAQ, waitlist, contact and call-to-action sections.
• Application blocks: Dashboard shell, settings, team management, notification center, billing portal and search results.
• Operations: Resource manager, data explorer, import workflow, approval queue, audit log viewer, incident dashboard and report builder.
• Maps and content: Map frame, markers, legend and route summary, plus article, documentation, changelog and community feed pages.

Tech stack

• React, shadcn/ui, Tailwind CSS
• class-variance-authority, tw-animate-css, lucide-react

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @uai/component-name