import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12

import Controls 1.0 as Controls
import Cubo 1.0
import Utils 1.0

Popup {
    id: root
    closePolicy: Popup.NoAutoClose

    property string text: ""
    property var type: DataTypes.StateType.Info
    property color color: switch (type) {
                          case DataTypes.StateType.Info:
                              return "#0A72BA"
                          case DataTypes.StateType.Good:
                              return "#009352"
                          case DataTypes.StateType.Warning:
                              return "#E5C207"
                          case DataTypes.StateType.Error:
                              return "#CF3200"
                          case DataTypes.StateType.Neutral:
                          default:
                              return "#838D97"
                          }

    property var icon: switch (type) {
                          case DataTypes.StateType.Info:
                              return "qrc:/Icons/info-state.svg"
                          case DataTypes.StateType.Good:
                              return "qrc:/Icons/good-state.svg"
                          case DataTypes.StateType.Warning:
                              return "qrc:/Icons/warning-state.svg"
                          case DataTypes.StateType.Error:
                              return "qrc:/Icons/error-state.svg"
                          case DataTypes.StateType.Neutral:
                          default:
                              return "qrc:/Icons/neutral-state.svg"
                          }



    RowLayout {
        spacing: 15

        Image {
            source: root.icon
            Layout.leftMargin: 5
        }

        Controls.SubtitleLabel {
            id: label
            text: root.text
            maximumLineCount: 10
            wrapMode: Text.Wrap
        }
    }

    background: Rectangle {
        radius: 6
        color: "#F7F8FC"

        Rectangle {
            radius: 6
            anchors.fill: parent
            color: Qt.rgba(root.color.r, root.color.g, root.color.b, 0.1)
        }

        Rectangle {
            radius: 6
            width: 4
            height: parent.height
            anchors.left: parent.left
            color: root.color
        }
    }

    enter: Transition {
        NumberAnimation {
            property: "opacity"
            from: 0.0
            to: 1.0
            duration: 300
        }
    }

    exit: Transition {
        NumberAnimation {
            property: "opacity"
            from: 1.0
            to: 0.0
            duration: 2500
        }
    }
}