API Reference
<GanttChart /> Props
| Prop | Type | Default | Description |
|---|---|---|---|
| tasks | GanttTask[] | Required | The array of task objects to render. |
| columns | GanttColumn[] | Standard Name/Dates | Configuration for the left-hand data grid. |
| resources | GanttResource[] | [] | List of resources available for assignment. Required for resource leveling and the Resource Panel. |
| autoLevelResources | boolean | false | When true, runs resource leveling after each scheduling cascade. |
| onTasksChange | (tasks) => void | — | Callback fired whenever tasks are mutated. |
| autoSchedule | boolean | false | When true, runs cascadeSchedule on every task change. |
| viewMode | ViewMode | 'day' | Zoom level — controls the time scale header and pixel density. |
| theme | GanttTheme | Built-in Light Theme | CSS custom property token map to theme the component. |
| renderTask | (task) => ReactNode | — | Custom renderer replacing the default task bar. |
| headless | boolean | false | If true, suppresses the injection of theme CSS custom properties. |
| showCriticalPath | boolean | false | If true, highlights tasks with float <= 0. |
| showResourcePanel | boolean | false | If true, renders the resource allocation histogram panel below the Gantt chart. |
| plugins | GanttPlugin[] | [] | Plugin instances to install into the Gantt. |
| i18n | Partial<I18nOptions> | defaultI18n | Partial i18n overrides for locale-specific strings. |
| calendar | WorkingCalendar | AllDayCalendar | Working calendar for scheduling and drag snapping. |
GanttTask Structure
| Field | Type | Description |
|---|---|---|
| id | string | Unique identifier for the task. Must be stable across renders. |
| name | string | Display name of the task. |
| start | Date | The scheduled start date/time. |
| end | Date | The scheduled end date/time. |
| progress | number | Completion percentage (0-100). |
| type | 'task' | 'group' | 'milestone' | Task rendering variant. Default is 'task'. |
| parentId | string | ID of the parent group task. |
| dependencies | TaskDependency[] | Includes id, type (FS, SS, FF, SF), and optional lag (working days, negative for lead). |
| baselineStart | Date | Original planned start date. Display-only (gray shadow bar). |
| baselineEnd | Date | Original planned end date. Display-only. |
| assignments | TaskAssignment[] | Resource assignments. Used by the Resource Panel to calculate utilization. |
| float | number | Read-only. Total float in milliseconds. <= 0 means critical path. |
| constraint | TaskConstraint | Scheduling constraint (ASAP, ALAP, SNET, MSO). |
| constraintDate | Date | Required date for SNET and MSO constraints. |
Context API (useGanttContext)
If you are building custom UI overlays, external toolbars, or advanced plugins, you can consume the internal Gantt state via the useGanttContext hook.
import { useGanttContext } from 'ganttcraft';
function CustomGanttToolbar() {
const { tasks, historyManager, undo, showCriticalPath } = useGanttContext();
return (
<div>
<button onClick={undo} disabled={!historyManager.canUndo()}>Undo</button>
<span>Total Tasks: {tasks.length}</span>
</div>
);
}Available Context Properties:
- tasks (GanttTask[]): The current scheduled state of all tasks.
- columns / resources (array): The columns and resources passed into the chart.
- updateTask (function): Updates a task, cascades schedule if autoSchedule is on, and registers an undo command.
- addDependency (function): Programmatically draws an FS dependency between two tasks.
- deleteTask (function): Removes a task and cleans up any dangling dependencies pointing to it.
- viewMode (ViewMode): The current timescale resolution.
- virtualWindow (VirtualWindow): Describes which rows are currently rendered in the virtualized scroll view.
- historyManager (HistoryManager): The internal manager handling the undo/redo stack.
- undo / redo (function): Triggers undo/redo actions directly.
- conflicts (ConflictMap): Map of constraint conflicts or scheduling errors detected in the current run.