Packages

Vanilla JS Core

The GI-Gantt chart functionality is available as a Vanilla JS package with types from @gantt-insights/gi-gantt-core.

This core package exposes renderElement similarly to how framework specific wrappers do with the only difference being the parent div passed in the callback args. Children can be added/removed/managed as needed.

The renderElement is defined as follows

export type ElementPosition = {
  left: number;
  top: number;
  width: number;
  height: number;
};

export type RenderElement = (
  parent: HTMLDivElement,
  elementPosition: ElementPosition,
) => void;

An example of a vanilla JS renderElement

const renderElement = (parentDiv, _elementPosition) => {
  parentDiv.innerHTML =
    '<div style="width: 100%; height: 100%; background-color: red;"></div>';
};

React

A react package is available under @gantt-insights/gi-gantt-react. This package is a wrapper around the Vanilla JS Core package.

Other frameworks

Wrapper packages for other frameworks like Angular, Vue and Svelte are in the works.