LibrePCB

import { Data } from "../api.slint";

export component MessageBanner inherits Rectangle {
    in property <bool> shown: true;
    in property <string> text;
    in property <color> text-color: Data.theme.warning-text;

    // Do not directly animate the height, as it would also animate when the
    // window is resized, which is annoying.
    property <float> height-factor: shown ? 1 : 0;
    animate height-factor { duration: 150ms; }

    width: 100%;
    height: self.preferred-height * height-factor;
    background: Data.theme.warning;
    visible: self.height > 0;
    clip: true;

    VerticalLayout {
        padding: 5px;
        spacing: 5px;

        if !text.is-empty: txt := Text {
            color: text-color;
            font-weight: 700;
            horizontal-alignment: left;
            vertical-alignment: center;
            wrap: word-wrap;
            text: text;
        }

        @children
    }
}