Skip to content

Module Extensions

ColumnRegular (Extended from @revolist/revogrid)

ts
interface ColumnRegular {
  // showWeekNumbers?: boolean;
      // dateFormat?: string;
      // hideWeekends?: boolean;
      milestoneMode?: boolean
}

Plugin API

editorTimeline

The editorTimeline is a custom cell editor for RevoGrid that provides a timeline input to edit date ranges directly within the grid cells.

Features:

  • Renders a timeline bar with start and end date inputs
  • Supports date range selection with date pickers
  • Shows progress based on current date
  • Optional week numbers display
  • Optional weekend hiding
  • Milestone mode support
  • Custom date format support
  • Group summary support
  • Threshold support for progress visualization

Usage:

typescript
import { editorTimeline } from '@revolist/revogrid-pro'

const grid = document.createElement('revo-grid');
grid.columns = [
  {
    prop: 'timeline',
    name: 'Timeline',
    cellTemplate: editorTimeline,
    milestoneMode: false,
    thresholds: [
      { value: 25, className: 'low' },
      { value: 50, className: 'medium' },
      { value: 75, className: 'high' }
    ]
  },
];
ts
editorTimeline: CellTemplate | undefined;

TimelineValue

ts
interface TimelineValue {
  from: string;
  to: string;
  progress?: number
}

DateRange

ts
interface DateRange {
  start: Date;
  end: Date
}

DateService

ts
class DateService {}