import QtQuick
import QtQuick.Controls.impl
import QtQuick.Controls
import QtQuick.Templates as T

T.ToolButton {
    id: control

    property string target

    checkable: true
    icon.color: Colors.foreground
    icon.height: 36
    icon.width: 36
    implicitHeight: 90
    implicitWidth: 100
    topPadding: 20

    contentItem: Column {
        readonly property color color: control.checked ? Colors.primaryShade : control.hovered ? Colors.primary : Colors.foreground

        IconLabel {
            color: parent.color
            icon.color: parent.color
            icon.height: control.icon.height
            icon.source: control.icon.source
            icon.width: control.icon.width
            x: parent.width * .5 - width * .5
        }
        Label {
            color: parent.color
            font: Typography.small
            text: control.text
            x: parent.width * .5 - width * .5
        }
    }

    Rectangle {
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        anchors.top: parent.top
        color: control.checked ? Colors.primaryShade : Colors.primary
        implicitWidth: 6
        visible: control.checked || control.hovered
    }
    MouseArea {
        id: mouseArea

        anchors.fill: parent
        cursorShape: Qt.PointingHandCursor

        onPressed: mouse => mouse.accepted = false
    }

    onClicked: {
        if(!target) {
            console.warn(`BarButton with text ${this.text} has no target.`)
            return
        }
        contentStack.replace(target)
    }
}