Free components for building your own support agent — bring any backend.Want the agent too? Inflection resolves support requests inside your app.

Block

Support widget

The whole thing in one block: launcher, home, past conversations, help articles and the conversation itself, behind one tab bar.

Install

npx shadcn@latest add https://ui.inflection.network/r/support-widget.json

Pulls in utils, launcher, panel, agent-header, message-list, composer, banner, tab-bar, home-card, home-screen, help-center automatically.

Usage

Props

NameTypeDescription
messages*ListMessage[]The open conversation's turns.
onSend*(text: string) => void
conversationsConversation[]Past conversations. Omit and the Messages tab disappears.
articlesHelpArticle[]Omit and the Help tab disappears — an empty tab is a promise the product does not keep.
onNewConversation() => voidFired when the user asks for a fresh one, so you can mint a session.
onOpenConversation(id: string) => voidLoad that conversation into `messages`.
newsNewsItem[]Announcements on the home view.
streamingstringThe in-flight reply.
busybooleanA reply is on its way.
errorstring | nullRendered as an error banner above the composer.
slotReactNodeAbove the composer — usually `<AgentActions>`.
agentNamestringDefault: "Support"
inlinebooleanRender in place instead of floating over the app.

* required