Hi,
There seems to be a weird scrolling/UI bug that I can't find a work-around for.
I have a grid with two regions defined as follows:
const gridConfig: BryntumGridProps = {
// Bryntum Grid config options
columns: [
{
text: 'Placements',
children: columns,
region: 'left',
},
{
text:
filterSettings.durationInDays == 1
? moment(selectedDate).format('DD MMM')
: moment(dateFrom).format('DD MMM') +
' - ' +
moment(dateTo).format('DD MMM'),
children: dateColumns,
region: 'right',
},
],
store: store,
features: {
regionResize: true,
cellMenu: false,
headerMenu: false,
},
};
This appears as:
[img]C:\temp\PlacementManager\eg-1.png[/img]
But follow these steps...
1) Drag the region splitter to the right (which is a bit difficult as the splitter doesn't quite follow the mouse drag) so that some of the columns cannot be seen (a scrollbar appears as expected).
2) Collapse the region to the right by clicking the > arrow on the splitter, so the entire right-side region disappears.
3) Expand the region again by clicking the < arrow on the splitter
4) Drag the splitter to the left to see more of the right-hand region.
When you follow these steps, the grid seems to get very confused as to how much space there is on the right-hand region. The columns on the right are restricted to a small width with a narrow scrollbar, leaving a big empty space on the right.
[img]C:\temp\PlacementManager\eg-3.png[/img]
i.e. Assuming you have Col1 to Col5 on the right hand side you get
|------------------------------------|
| Col1 | Col2 | Col3 | Co | |
| | | | | |
| | | | | |
|<----scrollbar-------> |
(scrollbar filling only some of the available width).