Grid, Export, Rendering

These helpers package common grid-side Gantt work without coupling your application to internal timeline layout data.

import {
  createGanttColumnPreset,
  createGanttContextMenuQuickWinRecipe,
  createGanttExcelExportRecipe,
  createGanttPdfExcelReportingRecipe,
  createGanttTaskStatusIndicatorRecipe,
  createTaskStatusIndicators,
  mapGanttRowsToExcelExport,
} from '@revolist/revogrid-enterprise';

Gantt Excel Export Mapping

Use mapGanttRowsToExcelExport() when exporting projected task rows. The mapper uses an allowlist of user-facing fields and skips renderer-only timeline metadata.

const rows = mapGanttRowsToExcelExport(taskRows, project, {
  includeResourceRows: false,
});

downloadWorkbook({
  sheetName: project.name,
  rows,
});

For shells that prefer a recipe object:

const recipe = createGanttExcelExportRecipe({
  rows: taskRows,
  project,
});

downloadWorkbook({
  fields: recipe.fieldNames,
  rows: recipe.rows,
});

PDF And Excel Reporting

Use the combined reporting recipe when your app has separate toolbar buttons for stakeholder PDF reports and spreadsheet handoff. PDF uses the browser print dialog, so users can choose Save as PDF. Excel dispatches the Pro export-excel event, so include ExportExcelPlugin with the grid plugins.

import {
  GanttPlugin,
  createGanttPdfExcelReportingRecipe,
} from '@revolist/revogrid-enterprise';
import { ExportExcelPlugin } from '@revolist/revogrid-pro';

const grid = document.querySelector<HTMLRevoGridElement>('revo-grid');
const host = document.querySelector<HTMLElement>('#gantt-report');

if (!grid || !host) {
  throw new Error('Gantt report target was not found');
}

grid.plugins = [GanttPlugin, ExportExcelPlugin];
grid.gantt = project;

const reportRange = {
  startDate: '2026-05-01',
  endDate: '2026-05-31',
};

const reporting = createGanttPdfExcelReportingRecipe({
  grid,
  target: host,
  document,
  window,
  excel: {
    workbookName: `${project.name}.xlsx`,
  },
});

pdfButton.addEventListener('click', () => {
  const result = reporting.exportPdf(project, reportRange);

  if (!result.ok) {
    showExportError(result.reason);
  }
});

excelButton.addEventListener('click', () => {
  reporting.exportExcel({
    sheetName: 'Tasks',
  });
});

For a single “export report” action, call both commands together:

const result = reporting.exportReport(project, {
  range: { label: 'Executive status report' },
  excel: { sheetName: 'Task register' },
});

if (!result.pdf.ok) {
  showExportError(result.pdf.reason);
}

Column Presets

Column presets group the default Gantt task-table columns into common planning views.

grid.columns = createGanttColumnPreset('schedule');
grid.source = [...taskRows];

Available presets include core, schedule, dependencies, resources, baseline, cost, progress, and all.

Read-Only And Locked Indicators

Use indicator helpers to produce labels and class names for custom cell renderers.

const status = createTaskStatusIndicators({
  taskId: row.id,
  projectReadOnly,
  taskLocked: lockedTaskIds.has(row.id),
});

renderIndicatorCell({
  className: status.classNames.join(' '),
  title: status.label,
  indicators: status.indicators,
});

For multiple rows:

const indicatorRows = createGanttTaskStatusIndicatorRecipe({
  rows: taskRows,
  projectReadOnly,
  lockedTaskIds,
});

Context Menu Extensions

Gantt installs separate RevoGrid Pro row and column context menus. Row menus are task-oriented (Add task, Indent task, Outdent task, Delete task). Main grid column menus expose search, sort, and filter actions. The pinned Gantt canvas column menu exposes timeline zoom controls.

Use context-menu recipes with rowContextMenu to add duplicate, assign-resource, export, or custom task actions.

const contextMenuItems = createGanttContextMenuQuickWinRecipe({
  duplicate: {
    copyName: (task) => `${task.name ?? 'Task'} copy`,
  },
  delete: {
    confirm: (context) => window.confirm(`Delete ${context.task?.name ?? 'task'}?`),
    onDeleteTask: (context) => {
      if (context.taskId) {
        deleteTask(context.taskId);
      }
    },
  },
  assignResource: {
    onAssignResource: (context) => {
      if (context.taskId) {
        openResourcePicker(context.taskId);
      }
    },
  },
  export: {
    exportOptions: (context) => ({
      workbookName: 'gantt.xlsx',
      sheetName: context.task?.name ?? 'Gantt',
    }),
  },
});

grid.rowContextMenu = {
  ...grid.rowContextMenu,
  items: [...(grid.rowContextMenu?.items ?? []), ...contextMenuItems],
};

Disable individual items with false.

const exportOnly = createGanttContextMenuQuickWinRecipe({
  duplicate: false,
  delete: false,
  assignResource: false,
  export: { name: 'Export visible Gantt tasks' },
});