Props API Reference

The HyVue Gantt library exposes a comprehensive set of props through its components. This reference documents all available props and their usage.

GGanttChart Props

Time Management Props

These props control the temporal aspects of your Gantt chart:

interface TimeManagementProps {
  chartStart: string | Date;        // Start date of visible range
  chartEnd: string | Date;          // End date of visible range
  precision: TimeUnit;              // Time unit precision
  barStart: string;                 // Property name for bar start dates
  barEnd: string;                   // Property name for bar end dates
  dateFormat?: string | false;      // Date format string
  enableMinutes?: boolean;          // Enable minutes precision
  currentTime?: boolean;            // Show current time indicator
  currentTimeLabel?: string;        // Current time indicator label
}

Visual Configuration Props

Props that control the visual appearance:

interface VisualProps {
  width?: string;                            // Chart width
  rowHeight?: number;                        // Height of each row
  grid?: boolean;                            // Show background grid
  hideTimeaxis?: boolean;                    // Hide the time axis
  colorScheme?: string | ColorScheme;        // Color scheme
  font?: string;                             // Font family
  labelColumnTitle?: string;                 // Label column title
  labelColumnWidth?: number;                 // Label column width
  holidayHighlight?: string;                 // Country code for date-holidays
  rowClass?: (row: ChartRow) => string;      // Method to add classes to data rows
  rowLabelClass?: (row: ChartRow) => string; // Method to add classes to label rows
  dayOptionLabel?: DayOptionLabel[];         // Customization for time unit day
  highlightedHours?: number[];               // Array of hours to highlight (0-23)
  highlightedDaysInWeek?: number[];          // Array of days to highlight (0-6, 0 is Sunday)
  highlightedDaysInMonth?: number[];         // Array of days to highlight (1-31)
  highlightedMonths?: number[];              // Array of months to highlight (0-11, 0 is January)
  highlightedWeek?: number[];                // Array of weeks to highlight (1-53)
  locale?: string;                          // Locale for dayjs
}

Behavior Props

Props that control chart behavior:

interface BehaviorProps {
  pushOnOverlap?: boolean;          // Push overlapping bars
  pushOnConnect?: boolean;          // Push connected bars
  noOverlap?: boolean;              // Prevent bar overlap
  commands?: boolean;               // Show control commands
  maxRows?: number;                 // Maximum visible rows
  initialSortDirection?: SortDirection; // Initial sort direction
}

Connection Props

Props for configuring bar connections:

interface ConnectionProps {
  enableConnections?: boolean;      // Enable connections
  defaultConnectionType?: ConnectionType; // Default connection type
  defaultConnectionColor?: string;  // Default connection color
  defaultConnectionPattern?: ConnectionPattern; // Default pattern
  defaultConnectionAnimated?: boolean; // Enable animations
  defaultConnectionAnimationSpeed?: ConnectionSpeed; // Animation speed
}

GGanttRow Props

interface GGanttRowProps {
  label: string;                    // Row label
  bars: GanttBarObject[];          // Bar data array
  highlightOnHover?: boolean;      // Highlight on hover
}