Not getting mouse click on TabBar

[BikashRDas]

Hi,
I have code something similar to this:

Window {
    id: window
    visible: true
    width: 800
    height: 480
    title: qsTr("Hello World")

    TabBar {
        width: parent.width
        height: 60
        TabButton {
            text: "TAB 1"
        }
        TabButton {
            text: "TAB 2"
        }
        TabButton {
            text: "TAB 3"
        }
        TabButton {
            text: "TAB 4"
        }
    }

    MouseArea {
        anchors.fill: parent
        propagateComposedEvents: true
        onClicked: {
            console.log("Mouse area clicked")
            mouse.accepted = false
        }
    }
}

I am not getting the mouse click on the tabs, even after setting mouse.accepted = false. Any solution?