Mini Kabibi Habibi

layout cxui_start_bar {
    constant:
        bar_title: '$$$/CxUI/Start/Bar/Title=Start Bar';

        bar_button_width:   38;
        bar_button_height:  35;
        text_button_height: bar_button_height - 7;

        drag_bar_width: 12;

    interface:
        includeGenerateImage: true;

    view cxui_bar_window(name: bar_title,
                         placement: place_row,
                         spacing: 0,
                         margin: 0) {
        cxui_background_view(placement: place_row,
                             margin: 0,
                             spacing: 0,
                             horizontal: align_fill,
                             vertical: align_fill) {
            cxui_drag_bar(identifier: @drag,
                          width: drag_bar_width,
                          horizontal: align_left,
                          vertical: align_fill);
            TView(width: 3);
            row(margin: [0, gTinyGap, 0, gTinyGap],
                spacing: gGap,
                horizontal: align_left,
                vertical: align_fill) {
                TIconButton(identifier: @import_image,
                            dataType: 'int32',
                            frame: 2,
                            fontColorFromTheme: true,
                            alignIconTextTogether: true,
                            width: bar_button_width,
                            height: text_button_height,
                            horizontal: align_left,
                            vertical: align_center,
                            button_style: 'context_bar',
                            iconRootName: 'CxUI_AddContent',
                            layoverText: '$$$/CxUI/Start/Bar/Button/ImportImage/Name=Import image',
                            layoverTextPosition: align_right,
                            tooltip: '$$$/CxUI/Start/Bar/Button/ImportImage/Tooltip=Import image');
                TOptional(bind: @includeGenerateImage,
                          value: true,
                          placement: place_row,
                          margin: [0, gTinyGap, 0, gTinyGap],
                          spacing: gTinyGap,
                          horizontal: align_left,
                          vertical: align_fill) {
                    TIconButton(identifier: @generate_image,
                                dataType: 'int32',
                                frame: 2,
                                fontColorFromTheme: true,
                                alignIconTextTogether: false,
                                width: bar_button_width,
                                height: text_button_height,
                                horizontal: align_left,
                                vertical: align_center,
                                button_style: 'context_bar',
                                iconRootName: 'GenerateImage',
                                layoverText: '$$$/CxUI/Start/Bar/Button/GenerateImage/Name=Generate image',
                                layoverTextPosition: align_right,
                                tooltip: '$$$/CxUI/Start/Bar/Button/GenerateImage/Tooltip=Generate image',
                                richtooltip: true);
                }
            }
            TPunchButton(identifier: @more,
                         dataType: 'int32',
                         width: bar_button_width,
                         height: bar_button_height,
                         horizontal: align_left,
                         vertical: align_center,
                         button_style: 'context_bar',
                         iconRootName: 'CxUI_More',
                         tooltip: '$$$/CxUI/Bar/Common/Button/More/Tooltip=More options');
        }
    }
}