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.
groupingInfo? Array<Group> Information about the cell's grouping.
groupOrientation? GroupOrientation The orientation of groups: Vertical or Horizontal.
endOfGroup? boolean true if this cell is last in its group.

AllDayPanel.LayoutProps

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

Field Type Description
cellsData Array<AllDayPanel.CellData> Cells' meta data.
formatDate FormatterFn A function that formats dates according to the locale.
setCellElementsMeta (cellElementsMeta: CellElementsMeta) => void A function that formats dates according to the locale.
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.
groupingInfo? Array<Group> Information about the cell's grouping.
groupOrientation? GroupOrientation The orientation of groups: Vertical or Horizontal.
endOfGroup? boolean true if this cell is last in its group.
onDoubleClick? (e: object) => void A function that handles a double click on the cell.

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 appointment layer 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 All Day panel container content.

Localization Messages

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

Plugin Components

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

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