DevExtremeReactive
Version 4.0.10DemosDocsBlogGitHubBuy

Appointments Plugin Reference

A plugin that renders appointments.

Import

Use the following statement to import a plugin with embedded theme components:

import { Appointments } from '@devexpress/dx-react-scheduler-material-ui';

You can import the themeless plugin if you want to use custom components:

import { Appointments } from '@devexpress/dx-react-scheduler';

User Reference

Dependencies

Properties

Name Type Default Description
appointmentComponent ComponentType<Appointments.AppointmentProps> A component that renders an appointment.
appointmentContentComponent ComponentType<Appointments.AppointmentContentProps> A component that renders the appointment content.
splitIndicatorComponent ComponentType<Appointments.SplitIndicatorProps> A component that renders an element which indicates the appointment is divided.
recurringIconComponent ComponentType<object> A component that renders an icon for recurring appointments.
containerComponent ComponentType<Appointments.ContainerProps> A component that renders a container for the appointment.

Interfaces

Appointments.AppointmentProps

Properties passed to a component that renders an appointment.

Field Type Description
children ReactNode A React node used to render the appointment content.
data object An object that specifies the appointment data.
draggable boolean Specifies whether the appointment is draggable.
onClick? (e: object) => void A function that handles a click on the appointment.
onDoubleClick? (e: object) => void A function that handles a double click on the appointment.
isShaded? boolean Indicates whether the appointment is shaded.

Appointments.AppointmentContentProps

Properties passed to a component that renders the appointment content.

Field Type Description
children ReactNode A React node used to render the appointment's content.
data object An object that represents appointment data.
formatDate FormatterFn A function that formats dates according to the locale.
durationType string The appointment's duration type: "short" (the appointment occupies half of a timetable cell or less), "middle" (occupies the entire cell), or "long" (occupies more than one cell).
recurringIconComponent ComponentType<object> A component that renders an icon for recurring appointments.

Appointments.SplitIndicatorProps

Properties passed to a component that renders an element which indicates the appointment is divided.

Field Type Description
position 'start' | 'end' Specifies whether the element is rendered at the start or end of the divided appointment.
appointmentType 'vertical' | 'horizontal' Specifies whether the appointment is vertical or horizontal.

Appointments.ContainerProps

Properties passed to a component that renders a container for the appointment.

Field Type Description
style object An object that configures the appointment's geometry and position.

Plugin Components

Name Properties Description
Appointments.Appointment Appointments.AppointmentProps A component that renders an appointment.
Appointments.AppointmentContent Appointments.AppointmentContentProps A component that renders the appointment content.
Appointments.SplitIndicator Appointments.SplitIndicatorProps A component that renders an element which indicates the appointment is divided.
Appointments.Container Appointments.ContainerProps A component that renders a container for the appointment.

Additional properties are added to the component's root element.

Grid

Chart

Scheduler

Common Concepts

Core

Why We Use Cookies
This site uses cookies to make your browsing experience more convenient and personal. Cookies store useful information on your computer to help us improve the efficiency and relevance of our site for you. In some cases, they are essential to making the site work properly. By accessing this site, you consent to the use of cookies. For more information, refer to DevExpress’ privacy policy and cookie policy.