Layout.preferredHeight not correctly updating when binded to a function of implicitHeight

if we have nested layouts and alayout has its preferredHeight attached property as a function of implicitHeight, then when it changes, things are not relayouted correctly by the outside layout.

consider this example:

Item {
    width: 500
    height: 500
    ColumnLayout {
        id: topColumn
        width: parent.width
        RowLayout {
            Layout.fillWidth: true
            Layout.preferredHeight: implicitHeight
            Rectangle {
                id: headerContent
                color: "blue"
                Layout.preferredHeight: 30
                Layout.fillWidth: true
            }
        }
    }
    Button {
        y: topColumn.height
        text: "toggle"
        onClicked: headerContent.visible = !headerContent.visible
    }    
}

By clicking on the button, it shows/hides the headerContent Rectangle, causing the implicitHeight of its parent layout to go to zero and back from zero.

The  topColumn layout doesn't update its size correctly and is visible by the wrong positioning of the button (which has y binded to the topColumn's height).

The problem can be worked around by replacing

Layout.preferredHeight: implicitHeight

with

Layout.preferredHeight: implicitHeight ? implicitHeight : -1

(so it switched between considering Layout.preferredHeight and implicitHeight instead of "just" correctly binding to preferredHeight changes)