Context Menus

Context menu actions

Use scheduler context-menu hooks when product actions depend on the clicked event, empty slot, resource, or scheduler surface. The default event and slot menus are generic conveniences; products can replace them, append shared actions, or keep built-ins and filter individual commands.

| Config | Purpose | | --- | --- | | getSlotContextMenuItems | Replaces the empty-slot menu for the clicked slot. | | getEventContextMenuItems | Replaces the event-bar menu for the clicked event segment. | | getDayHeaderContextMenuItems | Defines optional day-header menu commands for products that expose header actions. | | getBackgroundContextMenuItems | Defines background/empty-scheduler-space commands. Slot backgrounds use this when no slot factory is supplied. | | contextMenuTemplate | Replaces the rendered content for scheduler-specific menu items. | | onContextMenuAction | Receives every scheduler-specific item selection with target context. | | hiddenItems / disabledItems | Hide or disable built-in scheduler actions by id. | | items / itemFilter | Compatibility hooks for appending raw Pro context-menu items or transforming built-ins. |

Scheduler-specific menu items support id, label, icon, shortcut, disabled, hidden, danger, separator, group, and action. Use danger for destructive actions, separator for visual breaks, and disabled / hidden functions when the command depends on event or slot state.

Menu item visibility and disabled state are resolved when the menu opens. If visibility depends on remote permissions or capacity checks, keep that state in application data and return it synchronously from hidden or disabled. Time-row context menus are optional; products that need them can use the underlying Pro row context-menu configuration until a dedicated scheduler time-row trigger is required.

grid.eventScheduler = {
  view: 'resourceTimeline',
  weekStartDate: '2026-06-08',
  contextMenu: {
    enabled: true,
    hiddenItems: { confirm: true },
    getEventContextMenuItems: ({ segment }) => [
      {
        id: 'open-record',
        label: 'Open record',
        icon: 'fa-solid fa-arrow-up-right-from-square',
        shortcut: 'O',
        action: () => openPlanningRecord(segment?.event.id),
      },
      { id: 'event-edit-separator', separator: true },
      {
        id: 'duplicate-event',
        label: 'Duplicate',
        shortcut: 'Cmd+D',
        disabled: ({ segment }) => segment?.event.locked === true,
        action: ({ segment }) => duplicateBooking(segment?.event.id),
      },
      {
        id: 'delete-event',
        label: 'Delete',
        danger: true,
        disabled: ({ segment }) => segment?.event.readonly === true,
        action: ({ segment }) => deleteBooking(segment?.event.id),
      },
    ],
    getSlotContextMenuItems: ({ slot }) => [
      {
        id: 'create-booking',
        label: 'Create booking here',
        icon: 'fa-solid fa-plus',
        shortcut: 'C',
        action: () => createBookingAt(slot?.startDateTime),
      },
      {
        id: 'block-slot',
        label: 'Block this time',
        group: 'availability',
        action: ({ slot }) => createHoldAt(slot?.startDateTime),
      },
    ],
    getBackgroundContextMenuItems: () => [
      { id: 'refresh-availability', label: 'Refresh availability' },
    ],
    contextMenuTemplate: (h, item) =>
      item.separator
        ? null
        : h('span', { class: 'planner-menu-item' }, [
            item.icon ? h('span', { class: item.icon }) : null,
            h('span', null, item.label),
            item.shortcut ? h('kbd', null, item.shortcut) : null,
          ]),
    onContextMenuAction: ({ itemId, target, segment, slot }) => {
      trackSchedulerMenuAction({ itemId, target, eventId: segment?.event.id, slot });
    },
  },
};

Built-in context-menu actions continue to respect scheduler permissions, locked resources, read-only mode, disabled/non-selectable slots, and conflict rules. The default built-in labels can be changed through labels, and all built-ins can be removed with hiddenItems, transformed with itemFilter, or replaced entirely with target-specific factories.

Built-in menu labels are generic by default: createEventHereAction, assignOpenEventAction, editEventAction, confirmEventAction, and markPlannedAction. Integrations should use these generic event labels or replace the menus with target-specific factories.