import Quickshell // for PanelWindow
import QtQuick // for Text
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell.Io
import Quickshell.Widgets
import Quickshell.Hyprland
import Quickshell.Services.UPower

ClippingWrapperRectangle {
    radius: 5
    width: 100; height: 30
    color: "red"
    Button {
        id: button
        text: "󰁹 " + Math.floor(UPower.displayDevice.percentage * 100) + "%"
        font.pointSize: 12
        implicitHeight: parent.height
        //icon.color: "red"
        //icon.source: "/nix/store/c4dcn4vl0v5njv4d587sazrad1xgyd9h-rose-pine-icon-theme-unstable-2022-09-01/share/icons/rose-pine/symbolic/devices/battery-symbolic.svg"
        onClicked: {
            menu.visible = true
            grab.active = true
        }
    }

    required property var window
    required property real popupOffset
    id: root

    PopupWindow {
        
        id: menu

        anchor.window: window
        anchor.rect.x: popupOffset
        anchor.rect.y: 50
        implicitWidth: 250
        implicitHeight: 150
        visible: false

        color: "transparent"
        
        ClippingWrapperRectangle {
            radius: 5

            implicitHeight: parent.height - 20
            implicitWidth: parent.width
            
            ColumnLayout {

                spacing: 0

                Button {
                    Layout.topMargin: 5
                    x: (parent.width - width) / 2
                    implicitWidth: parent.width - 10
                    implicitHeight: parent.height / 5 - parent.spacing

                    text: 'shutdown'
                }
            }
        }

        HyprlandFocusGrab {
            id: grab
            windows: [ menu ]
            onCleared: menu.visible = false
        }
    }
}