pragma ComponentBehavior: Bound
import QtQuick

// A push button built from primitives, so the app needs no Qt Quick Controls.
Rectangle {
    id: button

    property alias text: label.text
    signal clicked()

    implicitWidth: label.implicitWidth + 26
    implicitHeight: 30
    radius: 6
    color: tap.pressed ? "#e2dcd2" : hover.hovered ? "#efeae1" : "#f7f4ee"
    border.width: button.activeFocus ? 2 : 1
    border.color: button.activeFocus ? "#4d7ea8" : "#d8d2ca"
    antialiasing: true
    activeFocusOnTab: true

    Accessible.role: Accessible.Button
    Accessible.name: label.text
    Accessible.onPressAction: button.clicked()

    Text {
        id: label
        anchors.centerIn: parent
        color: "#2f2a36"
        font.pixelSize: 13
    }

    HoverHandler { id: hover }

    TapHandler {
        id: tap
        onTapped: button.clicked()
    }

    Keys.onPressed: function(event) {
        if (event.key === Qt.Key_Space || event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
            button.clicked()
            event.accepted = true
        }
    }
}