[grid] Provide minWidth and maxWidth properties for Grid's column
Describe your motivation
Currently it is not possible to set the boundaries of column resizing. At least min width is very important if a column can be resized.
https://github.com/vaadin/web-components/blob/23b5fdf56547f534686a40b09ef0c27f42cfd719/packages/grid/src/vaadin-grid-column-resizing-mixin.js#L60
Describe the solution you'd like
Grid's column has minWidth/maxWidth properties that are set to corresponding header and body elements (similar to width, flexGrow, etc.) and taken into account by ColumnResizingMixin.
Describe alternatives you've considered
No response
Additional context
No response
~Same as https://github.com/vaadin/web-components/issues/5940~
Same as #5940
Hi, not exactly the same. I personally more interested in minWidth property that is taken into account by resizer. The linked issue refers to the maxWidth only.
@glebfox can you describe a use case for the maxwidth part? In what situations would you want to limit how wide the end user can make a column?
For me it's not about the user who enlarges the grid column, but the grid itself creating columns that have at least 50px, but it can grow up to 300px with wider content; content that is larger than that gets clipped / ellipsed.
@rolfsmeds as I mentioned above, I personally more interested in minWidth property that is taken into account by resizer. I've created more generic issue because minWidth and maxWidth looks like related properties for me, so someone may be interested in maxWidth either. In terms of maxWidth, I agree with @knoobie that limiting the max width can be suitable in case of too looooong values so we prevent Grid from creating too wide columns.
Right, I suppose if we had minWidth and maxWidth properties for columns, it would be logical for them to affect both user resizing and autoWidth and flexGrow.
(Of course for flexGrow the width itself already functions as a minWidth, so in that case only maxWidth would have any effect, but for autoWidth both would be useful.)
Acceptance Criteria: https://github.com/vaadin/platform/issues/6553
I've been waiting for this, but got impatient, so I made something myself in the meantime:
fun <T> Grid.Column<T>.minWidth(minWidth: String): Grid.Column<T> {
val partName = "minWidth${this.hashCode()}"
this.element.appendChild(Html("<style>vaadin-grid::part($partName) { min-width: $minWidth }</style>").element)
this.setFlexGrow(0).setAutoWidth(true).setPartNameGenerator { partName }
return this
}
grid.addColumn("prop.fullNameWithSeparatedLastName").minWidth("20rem").setHeader(getTranslation("userManagement.name"))
grid.addColumn("prop.email").minWidth("18rem").setHeader(getTranslation("userManagement.email"))
It is a very nice function when the first visible values in the grid have few letters. Eliminates clippin... A must to have :-)