Appearance
Vanilla JavaScript
Status: implemented Web integration in the shared npm package.
Use createCalendar from @xsigns/chronosketch or createTimeline from @xsigns/chronosketch/timeline. Mount into a host and call destroy on teardown.
- Integration
- Calendar integration
- Calendar availability and runtime setters
- Gantt options and complete data example
- Shared CSS customization
Load the shared stylesheet for both components and the additional timeline stylesheet for Gantt. Models, options and callbacks are documented with each component; the adapters share behavior rather than separate scheduling logic.
Gantt supports optional group icons through groupIcons and timeline.setGroupIcons().
Gantt time-axis zoom supports zoom (1/2/4/6/8), a built-in slider and synchronized updates. showZoom: false hides the slider while retaining the configured zoom.
Calendar eventPresentation supports image: { src, variant? }. Gantt entryPresentation returns the same optional image/icon fields; callback changes update visible entries. See the Calendar presentation and Gantt guide.
Gantt accepts range: { start, days: 1095 } as an alternative to { start, end }. Range changes require a new instance (automatic in React/Vue). See Horizontal horizon.
Task Gantt
The separate TaskGantt integration supports task-based planning. See Task Gantt integration and its consumer dialog callbacks. Load shared CSS plus @xsigns/chronosketch/task-gantt/styles.css. Data updates retain scroll/collapse; full configuration changes rebuild the view. The application owns forms, persistence and confirmed data.
TaskGantt also supports optional progress editing through editableProgress and onTaskProgressChangeRequested; the application supplies confirmed data after each request.
TaskGantt enables sibling reordering when onTaskOrderChangeRequested is provided. Confirm the proposed task array through the same data update path as other editing requests.
Resource Timeline and TaskGantt both support heightMode: 'fill' | 'content'; see the Gantt height contract. Mode changes preserve the mounted view.
Availability Picker
See the Availability Picker guide for range rules, loading, content hooks and the vanilla integration.