Schedule a Meeting Dialog

ProNew

A dialog with a title, a date, start and end times and a list of attendees: the end follows the start by the chosen length, the end cannot be before the start, and attendees are added as rows. Use this when a dialog holds a form with a small repeating part.

Customize

This item has no props to tune. Use the lens above to change theme, density, direction and more.

Guide and examples

When to use it

A short create-event flow needs a date, a time range and several people, inside a dialog.

Do not use it when: For a full calendar editor with recurrence and time zones, use a page.

Installation

This item is part of tealmac UI Pro

The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.

Props

Prop	Type	Description
`onSchedule`	`(meeting) => Promise<void>`	Receives `{ title, date, start, end, attendees }` with blank attendees removed.

addMinutes(time, minutes) is exported.

Accessibility

Native date and time inputs give you the platform picker and keyboard entry; the length select keeps the end time in step with the start so people rarely type it.
Attendees are a Field Array inside the dialog: a fieldset with a legend, a hidden but real label per row ("Attendee 2 email"), add and remove buttons and spoken announcements.
Errors appear next to their fields after submit; the dialog keeps focus management, Enter to submit and the discard guard from Form Dialog.

Testing

The pattern ships with a Testing Library test (schedule-meeting-dialog.test.tsx) that covers: its main behaviour, the keyboard path and the error or empty states.