TimelineViewProps

Premium

Represents the properties of the KendoReact TimelineView Component.

Name	Type	Default	Description
className?	string		Sets a custom className to the wrapping element of the TimelineView.
columnWidth?	number		The width of a single time slot in pixels. Default is 100px.
currentTimeMarker?	boolean		If set to false the "current time" marker of the scheduler would not be displayed.
dateHeaderCell?	React.ComponentType<DateHeaderCellProps>		Represents component based on the DateHeaderCellProps.
dateRange?	DateRange | (args: SchedulerViewDateRangeArgs) => DateRange		Overrides the dateRange calculated by the Scheduler component. If a function is passed, an object of type SchedulerViewDateRangeArgs will be passed.
defaultShowWorkHours?	boolean		Sets the initial business-hour mode. Default true. This option applies only the initial showWorkHours state.
editable?	boolean | EditableProp		Overrides the general editable prop of the Scheduler for the specified view only.
editItem?	React.ComponentType<SchedulerEditItemProps>		Overrides the editableItem prop of the Scheduler for the specified view only.
editSlot?	React.ComponentType<SchedulerEditSlotProps>		Overrides the editSlot prop of the Scheduler for the specified view only.
endTime?	string		The end time of the view. The TimelineView displays events which are visible before the end time. Accepts string values in the HH:mm format.
form?	React.ComponentType<SchedulerFormProps>		Overrides the form prop of the Scheduler for the specified view only.
id?	string		Sets a custom id to the wrapping element of the TimelineView.
item?	React.ComponentType<SchedulerItemProps>		Overrides the item prop of the Scheduler for the specified view only.
name?	string		The name property is used by the Scheduler to match which view is selected. Every view has a default name.
numberOfDays?	number		Specifies the number of days that the view will render. Defaults to 1.
onDataAction?	(action: DataAction) => void		Called every time any of the SchedulerView Slots or Items trigger a data action, through editing, deleting or creating new DataItem.
selectedDateFormat?	string		The long-date format for displaying the selected date in the Scheduler toolbar. Defaults to {0:D} - {1:D} (more information)
selectedShortDateFormat?	string		The short-date format for displaying the selected date in the Scheduler toolbar. Defaults to {0:d} - {1-d} (more information)
showWorkHours?	boolean		If set to true, the view will be shown in the business-hours mode only. This will always override the internal showWorkHours state.
slot?	React.ComponentType<SchedulerSlotProps>		Overrides the slot prop of the Scheduler for the specified view only.
slotDivisions?	number		The number of divisions of the time slots.
slotDuration?	number		The duration (in minutes) of the time slots.
startTime?	string		The start time of the view. The TimelineView displays events which are visible after the start time. Accepts string values in the HH:mm format.
step?	number		Specifies the step by which the currently rendered days will be changed, when using the back and forwards buttons in the toolbar navigation.
style?	React.CSSProperties		Sets a custom style property to the wrapping element of the TimelineView.
timeHeaderCell?	React.ComponentType<TimeHeaderCellProps>		Represents component based on the TimeHeaderCellProps.
title?	string | (localization: LocalizationService) => string		The title to be displayed in the view selection list in the Toolbar. If a function is passed, it will receive a [LocalizationService]({ slug api_intl_localizationservice }) as an argument
viewItem?	React.ComponentType<SchedulerViewItemProps>		Overrides the viewItem prop of the Scheduler for the specified view only.
viewSlot?	React.ComponentType<SchedulerViewSlotProps>		Overrides the viewSlot prop of the Scheduler for the specified view only.
workDayEnd?	string		The end time of the view when showWorkHours is set to true. Accepts string values in the HH:mm format.
workDayStart?	string		The start time of the view when showWorkHours is set to true. Accepts string values in the HH:mm format.
workWeekEnd?	Day		The end of the work week.
workWeekStart?	Day		The start of the work week.