Support Channels Contact Block for React

Nowhere yet. The submit handler waits 800 milliseconds, as a stand-in for a request, then shows the confirmation. Replace that timer in submit with a call to your help desk or a form endpoint: details holds the name, email, subject, priority and message. Show the confirmation when the request succeeds, and an error line in the form when it doesn't.

No. support@helmlight.example uses the .example domain, which is reserved for examples, and +1 (415) 555-0173 is in the 555-0100 to 555-0199 range set aside for fiction. The labels such as "Usually within a day" are fixed text, not a live check: they should be the promises your team really keeps. Edit CHANNELS and the constants at the top of the file; the phone number keeps its order in a right-to-left layout.

It records Normal or Urgent in details.priority and repeats it in the confirmation. It never changes the form's behaviour, so what Urgent means (a different queue, a page to the on-call person) is yours to wire in submit. The hint under it says to keep Urgent for outages or a blocked team.

The label above it names the select's button for screen readers, and focus can land on that button when the subject is missing. The select's trigger takes the id, and the label points to it with htmlFor.

The header, then the channels as two rows of two short cells, then the form: its first field starts well inside the first screen. Name and email stack one per row below sm, the priority sits under the subject, the submit button goes full width, and the long email address wraps instead of scrolling the page sideways at 320 pixels.

It thanks the visitor by first name, repeats the subject and priority and the email replies go to, so a typo is easy to spot. It's a status region that takes focus when it appears, so a screen reader reads it at once, and "Send another message" brings back an empty form and puts focus on its heading. It promises no reply time: those are the published ones in the band above.