AllDayPanel Plugin Reference

A plugin that renders the All Day Panel.

Import

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

import { AllDayPanel } from '@devexpress/dx-react-grid-material-ui';

If you want to use custom components, you can import the themeless plugin:

import { AllDayPanel } from '@devexpress/dx-react-grid';

User Reference

Dependencies

Properties

Name Type Default Description
layoutComponent ComponentType<AllDayPanel.LayoutProps>   A component that renders an All Day panel layout.
cellComponent ComponentType<AllDayPanel.CellProps>   A component that renders an All Day panel cell.
rowComponent ComponentType<AllDayPanel.RowProps>   A component that renders an All Day panel row.
titleCellComponent ComponentType<AllDayPanel.TitleCellProps>   A component that renders a title cell.
appointmentLayerComponent ComponentType<AllDayPanel.AppointmentLayerProps>   A component that renders the appointment layer.
containerComponent ComponentType<AllDayPanel.ContainerProps>   A component that renders an All Day panel container.
messages? AllDayPanel.LocalizationMessages   An object that specifies localization messages.

Interfaces

AllDayPanel.CellData

Describes a cell data configuration object.

Field Type Description
startDate Date The cell’s start time.
endDate Date The cell’s end time.

AllDayPanel.LayoutProps

Describes properties passed to a component that renders an All Day panel layout.

Field Type Description
cellsData Array<Array<AllDayPanel.CellData>> Cells’ meta data.
allDayPanelRef (ref: ReactInstance) => void A function that accepts the All Day panel’s root React element.
cellComponent ComponentType<AllDayPanel.CellProps> A component that renders an All Day panel cell.
rowComponent ComponentType<AllDayPanel.RowProps> A component that renders an All Day panel row.

AllDayPanel.CellProps

Describes properties passed to a component that renders an All Day panel cell.

Field Type Description
startDate Date The cell’s start time.
endDate Date The cell’s end time.

AllDayPanel.RowProps

Describes properties passed to a component that renders an All Day panel row.

Field Type Description
children? ReactNode A React node used to render the row content.

AllDayPanel.TitleCellProps

Describes properties passed to a component that renders a title cell.

Field Type Description
getMessage (messageKey: string) => string Returns a localization message by the message key.

AllDayPanel.AppointmentLayerProps

Describes properties passed to a component that renders the appointment layer.

Field Type Description
children? ReactNode A React node used to render the row content.

AllDayPanel.ContainerProps

Describes properties passed to a component that renders an All Day panel container.

Field Type Description
children ReactNode A React node used to render the row content.

Localization Messages

Field Type Default Description
allDay? string ‘All Day’ The All Day panel’s title.

Plugin Components

Name Properties Description
AllDayPanel.Layout ComponentType<AllDayPanel.LayoutProps> A component that renders an All Day panel layout.
AllDayPanel.Cell ComponentType<AllDayPanel.CellProps> A component that renders an All Day panel cell.
AllDayPanel.Row ComponentType<AllDayPanel.RowProps> A component that renders an All Day panel row.
AllDayPanel.TitleCell ComponentType<AllDayPanel.TitleCellProps> A component that renders a title cell.
AllDayPanel.AppointmentLayer ComponentType<AllDayPanel.AppointmentLayerProps> A component that renders the appointment layer.
AllDayPanel.Container ComponentType<AllDayPanel.ContainerProps> A component that renders an All Day panel container.

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