React Scheduler Context Menu

This sample demonstrates how to extend the React Scheduler by attaching a fully interactive context menu to both cells and events. By right clicking (on desktop) or long pressing (on touch devices), users can quickly access actions without navigating away from the current Scheduler view.

The ContextMenu is externally rendered and linked to the Scheduler by assigning the Scheduler container as the menu's target. Based on where the user right clicks, the menu dynamically switches between cell actions (e.g., creating events) and event actions (e.g., editing or deleting an event).

The integration uses key Scheduler APIs to perform contextual operations:

• openEditor() - Opens the event editor for creating or modifying events.
• deleteEvent() - Removes selected events from the scheduler.
• getEventDetails() - Retrieves event data when a user right clicks an event.
• Quick navigation - Selecting Today updates selectedDate to jump directly to the current date.

This pattern enables a natural, desktop like workflow within the Scheduler, providing users with fast access to the actions they perform most often without cluttering the UI or interrupting their scheduling flow.