quickshell/launcher/Powermenu.qml

import Quickshell 
import QtQuick 
import QtQuick.Layouts
import QtQuick.Controls
import Quickshell.Wayland
import Quickshell.Io
import "root:/singeltons"

PanelWindow {
  id: root

  property bool show: false
  property int selectedIndex: 0
  property int buttonCount: 4


  implicitWidth: 600
  implicitHeight: 400
  visible: show
  focusable: true
  color: "transparent"

	WlrLayershell.keyboardFocus: WlrKeyboardFocus.Exclusive
  WlrLayershell.layer: WlrLayer.Top

  IpcHandler {
    target: "powermenu"

    function open(): void {
      root.selectedIndex = 0
      root.show = true
    }

    function close(): void {
      root.show = false
    }
  }

  function executeButton(index){
    switch (index){
      case 0:
        console.log("0")
        break
      case 1:
        console.log("1")
        break
      case 2:
        console.log("2")
        break
      case 3:
        console.log("3")
        break
    }
  }

  // Main window
  Rectangle {
    anchors.fill: parent
    anchors.centerIn: parent


    focus: true

    color: "#363a4f"
    border.color: Qt.hsla(0, 0, 1, 0.2)
    border.width: 2
    radius: 12

    Keys.onPressed: (event) => {
      switch (event.key){
        case (Qt.Key_Escape):
          root.show = false
          event.accepted = true
          break
        case (Qt.Key_Return):
        case (Qt.Key_Enter):
          root.show = false
          executeButton(root.selectedIndex)
          event.accepted = true
          break
        case (Qt.Key_Tab):
        case (Qt.Key_Right):
          root.selectedIndex = (root.selectedIndex + 1) % root.buttonCount
          event.accepted = true
          break
        case (Qt.Key_Left):
          root.selectedIndex = (root.selectedIndex - 1 + root.buttonCount) % root.buttonCount
          event.accepted = true
          break
        
      }
    }

    RowLayout {
      anchors.fill: parent
      anchors.margins: 20
        
      PowermenuButton {
        active: root.selectedIndex == 0
        icon: "⏻"
      }

      Item { Layout.fillWidth: true } // spacer

      PowermenuButton {
        active: root.selectedIndex == 1
        icon: ""

      }
      
      Item { Layout.fillWidth: true } // spacer

      PowermenuButton {
        active: root.selectedIndex == 2
        icon: ""
      }
      
      Item { Layout.fillWidth: true } // spacer

      PowermenuButton {
        active: root.selectedIndex == 3
        icon: ""
      }
    }
  }
}