Callout.razor

@namespace LumexUI.Docs.Client.Components

@using LumexUI.Shared.Icons

<div class="@BaseClass">
    <DynamicIcon Type="@_icon" class="@IconClass" />
    <p>@ChildContent</p>
</div>

@code {
    [Parameter] public RenderFragment? ChildContent { get; set; }
    [Parameter] public CalloutVariant Variant { get; set; }
    [Parameter] public Slots? Classes { get; set; }

    private string BaseClass => ElementClass.Empty()
        .Add( "not-prose" )
        .Add( "flex" )
        .Add( "p-4" )
        .Add( "my-6" )
        .Add( "gap-3" )
        .Add( "border" )
        .Add( "rounded-xl" )
        .Add( "bg-info-50/70 border-info-200 text-info-900", when: Variant is CalloutVariant.Info )
        .Add( "bg-danger-50/70 border-danger-200 text-danger-900", when: Variant is CalloutVariant.Danger )
        .Add( "bg-warning-50/70 border-warning-200 text-warning-900", when: Variant is CalloutVariant.Warning )
        .Add( "bg-success-50/70 border-success-200 text-success-900", when: Variant is CalloutVariant.Success )
        .Add( "bg-secondary-50/70 border-secondary-200 text-secondary-900", when: Variant is CalloutVariant.Tip )
        .Add( Classes?.Base )
        .ToString();

    private string IconClass => ElementClass.Empty()
        .Add( "mt-1.5" )
        .Add( "shrink-0" )
        .Add( Classes?.Icon )
        .ToString();

    private Type _icon = default!;

    protected override void OnInitialized()
    {
        _icon = Variant switch
        {
            CalloutVariant.Info => typeof( InfoIcon ),
            CalloutVariant.Warning => typeof( ShieldAlertIcon ),
            CalloutVariant.Danger => typeof( OctagonAlertIcon ),
            CalloutVariant.Success => typeof( CircleCheckIcon ),
            CalloutVariant.Tip => typeof( InfoIcon ),
            _ => throw new NotImplementedException()
        };
    }

    public class Slots
    {
        public string? Base { get; init; }
        public string? Icon { get; init; }
    }
}