import Quickshell
import qs.Common

PanelWindow {
    id: root

    property var modelData: null
    property var panelMonitor: modelData ? modelData.name : "DP-1"
    property var barComponentsLeft: []
    property var barComponentsCenter: []
    property var barComponentsRight: []

    screen: modelData
    implicitHeight: Theme.barSize

    color: "transparent"

    anchors {
        top: true
        left: true
        right: true
    }

    BarArea {
        anchors {
            left: parent.left
            verticalCenter: parent.verticalCenter
        }
        monitor: root.panelMonitor
        components: root.barComponentsLeft
    }

    BarArea {
        anchors {
            horizontalCenter: parent.horizontalCenter
            verticalCenter: parent.verticalCenter
        }
        monitor: root.panelMonitor
        components: root.barComponentsCenter
    }

    BarArea {
        anchors {
            right: parent.right
            verticalCenter: parent.verticalCenter
        }
        monitor: root.panelMonitor
        components: root.barComponentsRight
    }
    // Helper function to set monitor property on loaded items
}