diff --git a/examples/demos/dnd.js b/examples/demos/dnd.js index 12aa75111..b1594d5d3 100644 --- a/examples/demos/dnd.js +++ b/examples/demos/dnd.js @@ -83,6 +83,7 @@ class Dnd extends React.Component { resizable onEventResize={this.resizeEvent} onSelectSlot={this.newEvent} + onDragStart={console.log} defaultView={BigCalendar.Views.MONTH} defaultDate={new Date(2015, 3, 12)} /> diff --git a/src/addons/dragAndDrop/withDragAndDrop.js b/src/addons/dragAndDrop/withDragAndDrop.js index fb94e71e4..a192f6110 100644 --- a/src/addons/dragAndDrop/withDragAndDrop.js +++ b/src/addons/dragAndDrop/withDragAndDrop.js @@ -23,12 +23,13 @@ import { mergeComponents } from './common' * * Set `resizable` to true in your calendar if you want events to be resizable. * - * The HOC adds `onEventDrop` and `onEventResize` callback properties if the events are + * The HOC adds `onEventDrop`, `onEventResize`, `onDragStart` callback properties if the events are * moved or resized. They are called with these signatures: * * ```js * function onEventDrop({ event, start, end, allDay }) {...} * function onEventResize(type, { event, start, end, allDay }) {...} // type is always 'drop' + * function onDragStart({ event, action, direction }) {...} * ``` * * Moving and resizing of events has some subtlety which one should be aware of. @@ -53,6 +54,7 @@ export default function withDragAndDrop(Calendar) { static propTypes = { onEventDrop: PropTypes.func, onEventResize: PropTypes.func, + onDragStart: PropTypes.func, draggableAccessor: accessor, resizableAccessor: accessor, @@ -114,7 +116,11 @@ export default function withDragAndDrop(Calendar) { } handleBeginAction = (event, action, direction) => { + const { onDragStart } = this.props this.setState({ event, action, direction }) + if (onDragStart) { + onDragStart({ event, action, direction }) + } } handleInteractionStart = () => {