Hi Alex,
For Smart.Gantt, the cleanest approach is to make responsiveness part of the layout strategy rather than trying to resize the component manually on every window event.
A recommended pattern is:
1. Put Smart.Gantt inside a responsive container
– Use a parent element with flexible sizing (width: 100%, controlled height, flex/grid layout).
– Let the component calculate its available space from the container.
2. Handle resize events through a ResizeObserver
– Prefer observing the Gantt container instead of listening directly to window.resize.
– This also handles side panels, dashboard layout changes, and dynamic navigation areas.
Example:
const container = document.querySelector('#ganttContainer');
const gantt = document.querySelector('smart-gantt');
const resizeObserver = new ResizeObserver(() => {
gantt.refresh();
});
resizeObserver.observe(container);
Regards,
Markov
.
