CalendarTimelineListCalendarTimelineList component

UX Guidelines

Dev

UsageCode Example

<CalendarTimelineList
  events={events}
  initialTime={{hour: 9, minutes: 30}}
  timelineProps={{
    format24h: true,
    onEventPress: this.showEventActions,
    onBackgroundLongPress: this.createDraftEvent,
    onBackgroundLongPressOut: this.confirmEventDraft,
    unavailableHours: [{start: 0, end: 6}, {start: 22, end: 24}]
  }}
/>

TIP

This component extends the TimelineList props.

APIThis is the list of additional props for the component

events

{[date: string]: TimelineProps['events']}

Map of all timeline events ({[date]: events})

initialTime

TimelineProps['initialTime']

Should initially scroll to a specific time (relevant only for NOT 'today' timelines)

scrollToFirst

boolean

Should scroll to first event of the day

scrollToNow

boolean

Should initially scroll to current time (relevant only for 'today' timeline)

showNowIndicator

boolean

Should show now indicator (shown only on 'today' timeline)

timelineProps

Omit<TimelineProps, 'events' | 'scrollToFirst' | 'showNowIndicator' | 'scrollToNow' | 'initialTime'>

General timeline props to pass to each timeline item