import QtQuick
import qs.config

Rectangle {
    id: root

    property string text: ""
    // "normal", "accent", or "danger". Danger is for an action that cannot be
    // undone -- it never initiates one on a single press, it marks the press
    // that confirms it, so the confirming button cannot be mistaken for the
    // Cancel sitting next to it.
    property string tone: "normal"
    property bool enabled: true
    signal clicked

    implicitWidth: label.implicitWidth + 22
    implicitHeight: 31
    radius: 9
    opacity: enabled ? 1 : 0.45

    // The keyboard half of this component's own contract. Eleven files used
    // to bolt these on by hand while the other hundred-odd instantiations --
    // including every confirming button in every destructive flow -- were
    // pointer-only. The button carries them itself now, so a consumer cannot
    // forget them.
    activeFocusOnTab: root.enabled
    Accessible.role: Accessible.Button
    Accessible.name: root.text
    Accessible.focusable: root.enabled
    Accessible.focused: root.activeFocus
    Accessible.onPressAction: root.clicked()
    Keys.onReturnPressed: root.clicked()
    Keys.onEnterPressed: root.clicked()
    Keys.onSpacePressed: root.clicked()

    Rectangle {
        anchors.fill: parent
        anchors.margins: -3
        radius: parent.radius + 3
        visible: root.activeFocus
        color: "transparent"
        border.width: 2
        border.color: Theme.accentSecondary
    }
    color: {
        if (tone === "accent")
            return mouse.containsMouse ? Theme.mix(Theme.accent, Theme.fg, 0.12) : Theme.accent;
        if (tone === "danger")
            return mouse.containsMouse ? Theme.alpha(Theme.danger, 0.22) : Theme.alpha(Theme.danger, 0.12);
        return mouse.containsMouse ? Theme.alpha(Theme.fg, 0.13) : Theme.alpha(Theme.fg, 0.075);
    }
    border.width: tone === "accent" ? 0 : 1
    border.color: tone === "danger" ? Theme.alpha(Theme.danger, 0.45) : Theme.alpha(Theme.fg, 0.08)

    Text {
        id: label
        anchors.centerIn: parent
        text: root.text
        color: root.tone === "accent"
            ? Theme.bgDark
            : (root.tone === "danger" ? Theme.danger : Theme.fg)
        font.family: Theme.fontFamily
        font.pixelSize: Theme.fontSizeSmall
        font.weight: Font.Medium
    }

    MouseArea {
        id: mouse
        anchors.fill: parent
        enabled: root.enabled
        hoverEnabled: true
        cursorShape: Qt.PointingHandCursor
        onClicked: root.clicked()
    }
}