import QtQuick
import qs.Commons

// PillButton.qml - the panel's button: a bordered pill, filled when primary.
// `enabled: false` greys it out.
Rectangle {
  id: pb
  property string label: ""
  property bool primary: false
  // The bar's font; this file cannot see the panel, so it is handed in.
  property string fontFamily: Style.font.family
  signal triggered()

  implicitWidth: pbText.implicitWidth + Style.space(20)
  implicitHeight: Style.space(25)
  radius: Style.space(4)
  // `enabled: false` greys it out; the MouseArea inherits the flag.
  opacity: enabled ? 1.0 : 0.4

  readonly property color tint: primary ? Color.accent : Color.popups.text
  color: pbArea.containsMouse
    ? Qt.rgba(tint.r, tint.g, tint.b, primary ? 0.30 : 0.14)
    : Qt.rgba(tint.r, tint.g, tint.b, primary ? 0.16 : 0.00)
  border.width: 1
  border.color: Qt.rgba(tint.r, tint.g, tint.b, primary ? 0.75 : 0.30)

  Text {
    id: pbText
    anchors.centerIn: parent
    text: pb.label
    color: Color.popups.text
    font.family: pb.fontFamily
    font.pixelSize: Style.space(11)
    font.bold: pb.primary
  }

  MouseArea {
    id: pbArea
    anchors.fill: parent
    hoverEnabled: true
    cursorShape: Qt.PointingHandCursor
    onClicked: pb.triggered()
  }
}