Open ExtAnimal opened 7 months ago
Does autoHeight
work at all on the BryntumGantt
react wrapper component? The following code always has a fixed row height of 46px regardless of column width. The text does wrap to multi-line, but it doesn't cause the row height to increase.
import { useState } from 'react';
import '@bryntum/gantt/gantt.stockholm.css';
import { BryntumGantt } from '@bryntum/gantt-react';
function App() {
const [config] = useState(() => ({
columns: [
{
type: 'name',
field: 'name',
autoHeight: true,
width: 100,
}
]
}))
return (
<div>
<BryntumGantt {...config} project={{ tasks: [{ id: '1', name: 'Hello here is a really long name that I want to wrap text with less width'.repeat(10), startDate: new Date(), endDate: new Date()}] }} />
</div>
);
}
export default App;
I believe the issue is with the fixedRowHeight
prop. If you set that to false, autoHeight sorta works as expected.
<BryntumGantt fixedRowHeight={false} />
Setting it doesn't entirely fix it though. The row height is initially correct but then it resizes back down. When the grid re-renders again the height adjusts to be correct again. See the example below.
https://github.com/bryntum/support/assets/25965865/f2a01013-2e3d-480e-a7b0-909bca3df2c7
@jsakalos Do you know if there is any function on the ref
that could be called to force row re-measure?
Hi, because autoHeight
is managed by CSS, I believe row re-rendering will reset the state. But I am not sure it will pick up correct value for the height because of the initial problem what this ticket is about.
Try this https://bryntum.com/products/gantt/docs/api/Grid/view/GridBase#function-renderRows
Returning DOMConfig
from column renderer is the only reliable way to get this to work from what I've tried.
Forum post
It's because of
A blob of framework stuff does not place real DOM content right into the grid cell, so it cannot be measured to ascertain row height.
I'm not sure how or when DOM gets into the cell from the framework blob. But measuring would have to take place when that happens.
@jsakalos would be the one to tackle this.