@inherits DComponentBase

@* daisyUI Join: https://daisyui.com/components/join/ . Groups its direct children, rounding only the outer corners;
   give each of them the join-item class (e.g. <DButton class="join-item">). For a responsive group, add
   class="lg:join-horizontal" to a vertical one. *@
<div @attributes="AdditionalAttributes" class="@CssClass">
	@ChildContent
</div>

@code {
	[Parameter] public RenderFragment ChildContent { get; set; }
	[Parameter] public DDirection Direction { get; set; }

	string CssClass => Cx("join", Direction == DDirection.Vertical ? "join-vertical" : null, Class);
}