Resume Drop 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 your own call. details holds the name, email, role id, start date and optional profile slug, and the file state holds the PDF. Show the confirmation when the request succeeds, and an error line in the form when it doesn't.

One PDF, up to 5 MB. Until a file is chosen, the dropzone reads Drop a resume, or choose a PDF. After one is accepted, that dropzone is replaced by a chip with the file name, the size and a remove button. Removing the chip brings the dropzone back. A second file, a file that isn't a PDF, or a file over 5 MB shows that message under the field. Submit with nothing attached asks for the PDF and moves focus to the dropzone.

The word Role names the combobox, and focus can land on its input when the role is missing. The input takes the id, and the label points to it with htmlFor.

The calendar closes Saturdays, Sundays and any day before today, read from the visitor's clock. Today itself can be chosen. Submit also refuses a closed day if one is already in the field. The confirmation speaks the date as a weekday and a month, from the stored year-month-day text.

No. The label says optional. Empty, it passes. Filled, it has to be 3 to 40 characters of letters, numbers and hyphens, the part that follows linkedin.com/in/. The addon is the prefix, so the visitor doesn't type it. The confirmation mentions the profile only when they filled it in.

The card stays a single column. The LinkedIn prefix is set smaller so linkedin.com/in/ fits at 320 pixels. Name and email stack below sm, and the submit button goes full width. The header fades up once on load. With reduced motion it simply appears. hello@cinderfall.example and +1 (555) 010-0136 are fictional. Replace EMAIL, PHONE, PHONE_HREF and HOURS with yours.