diff --git a/src/Calendar.js b/src/Calendar.js index fe8a4d218..590a299fd 100644 --- a/src/Calendar.js +++ b/src/Calendar.js @@ -646,6 +646,7 @@ class Calendar extends React.Component { eventWrapper: elementType, dayWrapper: elementType, dateCellWrapper: elementType, + timeGutterHeader: elementType, toolbar: elementType, diff --git a/src/TimeGrid.js b/src/TimeGrid.js index 88d83e7ee..bb727b8bb 100644 --- a/src/TimeGrid.js +++ b/src/TimeGrid.js @@ -272,6 +272,7 @@ export default class TimeGrid extends Component { eventComponent={components.event} eventWrapperComponent={components.eventWrapper} dateCellWrapperComponent={components.dateCellWrapper} + timeGutterHeaderComponent={components.timeGutterHeader} onSelectSlot={this.handleSelectAllDaySlot} onSelectEvent={this.handleSelectAlldayEvent} onDoubleClickEvent={this.props.onDoubleClickEvent} diff --git a/src/TimeGridHeader.js b/src/TimeGridHeader.js index 2f88d54a0..f7016cf57 100644 --- a/src/TimeGridHeader.js +++ b/src/TimeGridHeader.js @@ -45,6 +45,7 @@ class TimeGridHeader extends React.Component { eventComponent: elementType, eventWrapperComponent: elementType.isRequired, dateCellWrapperComponent: elementType, + timeGutterHeaderComponent: elementType, onSelectSlot: PropTypes.func, onSelectEvent: PropTypes.func, @@ -148,6 +149,7 @@ class TimeGridHeader extends React.Component { eventComponent, dateCellWrapperComponent, eventWrapperComponent, + timeGutterHeaderComponent: TimeGutterHeader, } = this.props let style = {} @@ -161,7 +163,9 @@ class TimeGridHeader extends React.Component { style={style} className={cn('rbc-time-header', isOverflowing && 'rbc-overflowing')} > -
+
+ {TimeGutterHeader && } +
diff --git a/stories/Calendar.js b/stories/Calendar.js index 144c10fc0..93133d032 100644 --- a/stories/Calendar.js +++ b/stories/Calendar.js @@ -655,3 +655,22 @@ storiesOf('module.Calendar.week', module)
) }) + .add('custom time gutter header', () => { + const TimeGutter = () =>

Custom gutter text

+ + return ( +
+ +
+ ) + })