An appointment tooltip displays information about the appointment and contains buttons that manage the appointment.
The following plugin is required:
Import the plugin listed above. A user can click on an appointment to show its tooltip.
The following demo shows how to use the appointment tooltip in uncontrolled mode:
In controlled mode, the state of AppointmentTooltip
s should be controlled externally. To control their visibility, pass the visible
property and onVisibilityChange
event to the plugin. To manage the displayed data, pass the appointmentMeta property and onAppointmentMetaChange
event.
To customize the tooltip's appearance, specify the xxxComponent
properties (xxx
is the name of the element you want to customize). For example, the headerComponent
and contentComponent
properties are used to customize the tooltip's header and content, as shown in the code below. Refer to the AppointmentTooltip API reference page for a list of all xxxComponent
properties.