// SPDX-FileCopyrightText: 2024 vivi developers <vivi-ui@tuta.io>
// SPDX-License-Identifier: MIT

import { ButtonStyle } from "../foundation.slint";
import { MagicButtonBase } from "./magic_button_base.slint";
import { MagicText } from "./magic_text.slint";
import { MagicIcon } from "./magic_icon.slint";
import {
    MagicPalette,
    MagicFontSettings,
    MagicIconSettings,
    MagicSizeSettings,
    MagicLayoutSettings,
    MagicBorderSettings
} from "./styling.slint";

export component OutlineButton inherits MagicButtonBase {
    in property <string> text;
    in property <image> prefix_icon;
    in property <image> suffix_icon;

    style: {
        border_style: {
            border_radius: MagicBorderSettings.control_border_radius,
            border_width: 1px,
            border_brush: MagicPalette.border,
        },
        text_style: MagicFontSettings.body,
        icon_style: {
            icon_size: MagicIconSettings.body.icon_size,
            foreground: MagicPalette.accent_background,
        },
        layout_style: MagicLayoutSettings.control_style
    };

    preferred_min_height: MagicSizeSettings.control_height;
    accessible-label: root.text;

    if root.prefix_icon.width > 0 && root.prefix_icon.height > 0 : MagicIcon {
        y: (root.height - self.height) / 2;
        icon: root.prefix_icon;
        style: root.style.icon_style;
    }

    if root.text != "" : MagicText {
        text: root.text;
        style: root.style.text_style;
        vertical_alignment: center;
        overflow: clip;
    }

    if root.suffix_icon.width > 0 && root.suffix_icon.height > 0 : MagicIcon {
        y: (root.height - self.height) / 2;
        icon: root.suffix_icon;
        style: root.style.icon_style;
    }
}