dotfiles/.config/quickshell/NotificationToast.qml

import QtQuick

Rectangle {
    id: toast

    required property int index
    required property string appName
    required property string summary
    required property string body
    required property int toastId

    required property color bgColor
    required property color fgColor
    required property color accentColor
    required property string fontFamily
    required property Item rightAnchor
    required property var sourceModel

    z: 0
    y: rightAnchor.y + (rightAnchor.height - height) / 2
    height: 28
    width: contentRow.implicitWidth + 20
    color: bgColor
    border.color: accentColor
    border.width: 2
    topLeftRadius: 100
    bottomLeftRadius: 100
    visible: false

    property bool showing: false

    Component.onCompleted: {
        visible = true
        showing = true
        hideTimer.start()
    }

    x: showing ? rightAnchor.x - width + 30 : rightAnchor.x

    Behavior on x {
        id: xBehavior
        enabled: toast.showing
        NumberAnimation {
            duration: 400
            easing.type: Easing.InOutCubic
            onRunningChanged: {
                if (!running && !toast.showing) {
                    toast.visible = false
                    toast.sourceModel.remove(toast.index)
                }
            }
        }
    }

    Timer {
        id: hideTimer
        interval: 5000
        onTriggered: {
            xBehavior.enabled = true
            toast.showing = false
        }
    }

    Row {
        id: contentRow
        anchors.centerIn: parent
        spacing: 8

        Text {
            text: toast.appName
            color: toast.accentColor
            font.pixelSize: 11
            font.family: toast.fontFamily
            font.bold: true
            visible: toast.appName !== ""
            anchors.verticalCenter: parent.verticalCenter
        }

        Text {
            text: toast.summary
            color: toast.fgColor
            font.pixelSize: 13
            font.family: toast.fontFamily
            elide: Text.ElideRight
            width: Math.min(implicitWidth, 300)
            anchors.verticalCenter: parent.verticalCenter
        }

        Text {
            text: toast.body
            color: Qt.rgba(toast.fgColor.r, toast.fgColor.g, toast.fgColor.b, 0.7)
            font.pixelSize: 11
            font.family: toast.fontFamily
            elide: Text.ElideRight
            width: Math.min(implicitWidth, 200)
            visible: toast.body !== "" && toast.body !== toast.summary
            anchors.verticalCenter: parent.verticalCenter
        }

        Rectangle {
            height: 18
            width: 20
            color: toast.bgColor
        }
    }

    MouseArea {
        anchors.fill: parent
        cursorShape: Qt.PointingHandCursor
        onClicked: {
            hideTimer.stop()
            xBehavior.enabled = true
            toast.showing = false
        }
    }
}