Support Hub
Contact
Source and install need .
pnpm dlx shadcn@latest add @assembli/contact-splitContact Split
Contact section with support channels on the left and a routed form on the right. Topic cards swap in each topic's own fields (text inputs or chip choices), message prompt and response time; validation runs on send with inline errors and focus on the first one, then the card turns into a confirmation that says who will reply and when.
Props
Other props pass through to the root element.
eyebrow
React.ReactNode
Default
"Contact"title
React.ReactNode
Default
"Talk to a person, not a queue"intro
React.ReactNode
topics*
ContactSplitTopic[]
channels
ContactSplitChannel[]
aside
React.ReactNode
Small print under the channels, e.g. an office address.
legal
React.ReactNode
Small print under the send button, e.g. a privacy note with a link.
onSubmit
(data: ContactSplitSubmission) => Promise<void> | void
Called with the form data. Throw to show an error; resolve to show the confirmation.
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | React.ReactNode | "Contact" | |
| title | React.ReactNode | "Talk to a person, not a queue" | |
| intro | React.ReactNode | – | |
| topics* | ContactSplitTopic[] | – | |
| channels | ContactSplitChannel[] | – | |
| aside | React.ReactNode | – | Small print under the channels, e.g. an office address. |
| legal | React.ReactNode | – | Small print under the send button, e.g. a privacy note with a link. |
| onSubmit | (data: ContactSplitSubmission) => Promise<void> | void | – | Called with the form data. Throw to show an error; resolve to show the confirmation. |
