@inherits DComponentBase

@* daisyUI Alert: https://daisyui.com/components/alert/ . The alert is a grid of up to three cells: Icon, ChildContent
   (wrapped in one <div>, so a heading plus text stays one cell) and Actions. role="alert" comes before the splatted
   attributes, so a consumer can pass role="status" for a non-urgent message. *@
<div role="alert" @attributes="AdditionalAttributes" class="@CssClass">
	@Icon
	<div>@ChildContent</div>
	@if (Actions is not null)
	{
		<div class="flex gap-2">@Actions</div>
	}
</div>

@code {
	[Parameter] public RenderFragment Icon { get; set; }
	[Parameter] public RenderFragment ChildContent { get; set; }
	[Parameter] public RenderFragment Actions { get; set; }
	[Parameter] public DAlertColor Color { get; set; }
	[Parameter] public DAlertVariant Variant { get; set; }
	[Parameter] public DDirection Direction { get; set; }
	/// <summary>Vertical on small screens, horizontal from sm up (alert-vertical sm:alert-horizontal).</summary>
	[Parameter] public bool Responsive { get; set; }

	string CssClass => Cx("alert", ColorClass, VariantClass,
		Direction == DDirection.Vertical || Responsive ? "alert-vertical" : null, Responsive ? "sm:alert-horizontal" : null, Class);

	string ColorClass => Color switch
	{
		DAlertColor.Info => "alert-info",
		DAlertColor.Success => "alert-success",
		DAlertColor.Warning => "alert-warning",
		DAlertColor.Error => "alert-error",
		_ => null
	};

	string VariantClass => Variant switch
	{
		DAlertVariant.Outline => "alert-outline",
		DAlertVariant.Dash => "alert-dash",
		DAlertVariant.Soft => "alert-soft",
		_ => null
	};
}