Templates
v1.0.0Added in 1.6.0
A SaaS contact page: a validated form, copyable channels with live office hours, offices on a drawn map, a short FAQ and logos.
Pick a topic (Sales, Support, Partnerships, Press) as cards with arrow keys or a tap, then fill in name, work email, company, company size (a bottom sheet on phones) and a message with a live character counter, and tick the consent box. Send message checks every field: each problem shows under its field and focus jumps to the first one; the email is also checked as soon as you leave it, and errors clear as you fix them. Company size is required for Sales only. While onSubmit runs the button spins; then the form turns into a Message sent panel ("Thanks, Emma. We'll reply within one business day.") with Send another, which keeps your name and email. Next to the form (under it on phones) the sales and support addresses and the phone number have copy buttons, Start a chat opens the chat, and Office hours shows Open now or Closed with the next opening, worked out in the office's time zone after the page loads. The office cards show each city's local time; picking one moves the drawn map and its Get directions link. The FAQ opens one answer at a time. The heading, form and channels rise in once on mount; reduced motion keeps them still.
npx wingo-ui@latest add contact-page