UNSELECTED WHEN CLICK OUTSIDE A MOUSEAREA

ThaoNguyen

hello, i have a button and i want i can unselected this button when i click anywhere outside its mousearea
this is Short version my code

Rectangle {
    id: actionButton
   //..........
   MouseArea {
        id: mouseArea
        anchors.fill: parent
        hoverEnabled: true
        onEntered: {
            actionButton.isHovered = true
        }
        onExited: {
            actionButton.isHovered = false
        }
        onClicked: {
            actionButtonClicked(actionButton.buttonId)
        }
    }
}

this is taskbar file,I have multiple button but just want this to happen with only the buttonMore

Rectangle {
id: taskbar

//........some other  button
        ActionButton {
            id: buttonMore
            buttonId: "3"
            popupText: "View more apps"
            defaultImageSource: "../../../assets/Taskbar/icons/more.png"
            activeImageSource: "../../../assets/Taskbar/icons/more_on.png"
            notifyCount: 0
            isDraggable: false
            modeButton: 2
            buttonHeight: 56
            buttonWidth: parent.width
            onActionButtonClicked: {
                isSelected = !isSelected
                if (isSelected) {
                    console.log("More apps is selected!")
                } else {
                    console.log("More apps is unselected!")
                }
            }
        }
}