pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Shapes

// Chamfered panel chrome for the dense status rail: outline, corner accent
// lines, and the optional header strip (id chip / title / meta / tick marks).
// Content is supplied as children by the call site.
//
// Palette and fonts are properties with defaults rather than references to the
// parent, because a component in its own file has no access to the enclosing
// scope. The defaults match DenseBarContent's, which is the repo's existing
// per-component convention (see quickshell/CLAUDE.md) — a shared theme
// singleton would be the place to collapse the duplication.
Item {
    id: panel

    property string panelId: ""
    property string title: ""
    property string meta: ""
    property bool showHeader: true
    property int chamfer: 13
    property int offsetY: 2
    property int accentLineThickness: 3

    property color voidColor: "#0a0a0a"
    property color inkColor: "#dedede"
    property color mutedColor: "#858585"
    property color accentColor: "#e8722a"
    property color hairColor: Qt.rgba(0.87, 0.87, 0.87, 0.28)
    property string displayFont: "DepartureMono Nerd Font"
    property string microFont: "DejaVu Sans Mono"

    Shape {
        id: panelShape
        anchors.fill: parent
        preferredRendererType: Shape.CurveRenderer

        ShapePath {
            fillColor: panel.voidColor
            strokeColor: panel.hairColor
            strokeWidth: 1
            startX: 0; startY: panel.offsetY
            PathLine { x: panelShape.width - panel.chamfer; y: panel.offsetY }
            PathLine { x: panelShape.width; y: panel.chamfer }
            PathLine { x: panelShape.width; y: panelShape.height }
            PathLine { x: panel.chamfer; y: panelShape.height }
            PathLine { x: 0; y: panelShape.height - panel.chamfer }
            PathLine { x: 0; y: panel.offsetY }
        }

        // Upper left accent line
        ShapePath {
            fillColor: panel.accentColor
            strokeWidth: 0
            startX: 0; startY: 0
            PathLine { x: Math.min(49, panelShape.width / 3); y: 0 }
            PathLine { x: Math.min(49, panelShape.width / 3); y: panel.accentLineThickness }
            PathLine { x: 0; y: panel.accentLineThickness }
            PathLine { x: 0; y: 0 }
        }

        // Lower right accent line
        ShapePath {
            fillColor: panel.accentColor
            strokeWidth: 0
            startX: panelShape.width; startY: panelShape.height
            PathLine { x: panelShape.width - Math.min(49, panelShape.width / 3); y: panelShape.height }
            PathLine { x: panelShape.width - Math.min(49, panelShape.width / 3); y: panelShape.height - panel.accentLineThickness }
            PathLine { x: panelShape.width; y: panelShape.height - panel.accentLineThickness }
            PathLine { x: panelShape.width; y: panelShape.height }
        }
    }

    Rectangle {
        visible: panel.showHeader
        x: 1; y: 22
        width: parent.width - 2
        height: 1
        color: panel.inkColor
        opacity: 0.12
    }

    Rectangle {
        visible: panel.showHeader
        x: 5; y: 7
        width: panel.panelId.length > 2 ? 29 : 24
        height: 11
        color: panel.accentColor
        Text {
            anchors.centerIn: parent
            text: panel.panelId
            color: panel.voidColor
            font.family: panel.microFont
            font.pixelSize: 8
            font.bold: true
        }
    }

    Text {
        visible: panel.showHeader
        x: 40; y: 7
        width: parent.width - 105
        text: panel.title
        color: panel.inkColor
        font.family: panel.displayFont
        font.pixelSize: 9
        font.bold: true
        font.letterSpacing: 1.1
        elide: Text.ElideRight
    }

    // Inlined rather than reusing DenseBarContent's MicroText, which is an
    // inline component and therefore not visible from another file.
    Text {
        visible: panel.showHeader && panel.meta.length > 0
        anchors.right: parent.right
        anchors.rightMargin: 12
        y: 6
        text: panel.meta
        width: Math.min(80, parent.width / 4)
        color: panel.mutedColor
        font.family: panel.microFont
        font.pixelSize: 6
        font.letterSpacing: 0.7
        horizontalAlignment: Text.AlignRight
        elide: Text.ElideRight
    }

    Row {
        visible: panel.showHeader
        anchors.right: parent.right
        anchors.rightMargin: 10
        y: 14
        spacing: 2
        Repeater {
            model: 5
            Rectangle { required property int index; width: 4; height: 2; color: panel.accentColor }
        }
    }
}