GridLayout does not respect columnSpacing

I'm trying to build a layout that should position delegates which have dynamic width. The layout should position the delegates in the columns of the first row as long as there is enough space left. If the last delegate of one row would occupy more space than the space left in the current row, this delegate should be positioned in the next line.

I have chosen a GridLayout to do the job by binding its columns to its width property and each delegate inside the layout occupies as many columns as its width by binding the attached Layout.columnSpan property to the delegates width property.

Everything works as expected as long as the property columnSpacing of the GridLayout is set to 0 pixels. The delegates "flow" into the next row if there is not enough space.

But if the columnSpacing is greater 0 the delegates get clipped by (numberOfDelegates - 1) * columnSpacing pixels before flowing into the next row. It seems like the GridLayout does not account for the spacing between the columns.

I've created a small example that showcases the described behaviour. The upper GridLayout has a columnSpacing of 0 whereas the lower one has a columnSpacing of 25 pixels. Although the spacing differs, both layouts break the rows synchronously.