Files
RolemasterDB/src/RolemasterDb.App/Components/Primitives/SurfaceDrawer.razor

78 lines
2.0 KiB
Plaintext

@if (IsOpen)
{
<button
type="button"
class="surface-drawer-backdrop"
aria-label="@CloseLabel"
@onclick="HandleCloseAsync"></button>
<aside class="@BuildCssClass()" aria-label="@AriaLabel">
@if (!string.IsNullOrWhiteSpace(Title) || HeaderContent is not null || OnClose.HasDelegate)
{
<header class="surface-drawer-header">
<div>
@if (!string.IsNullOrWhiteSpace(Title))
{
<strong class="surface-drawer-title">@Title</strong>
}
</div>
<div class="surface-drawer-header-actions">
@HeaderContent
@if (OnClose.HasDelegate)
{
<button type="button" class="btn btn-link" @onclick="HandleCloseAsync">Close</button>
}
</div>
</header>
}
<div class="surface-drawer-body">
@ChildContent
</div>
</aside>
}
@code {
[Parameter]
public bool IsOpen { get; set; }
[Parameter]
public string Placement { get; set; } = "end";
[Parameter]
public string AriaLabel { get; set; } = "Drawer";
[Parameter]
public string CloseLabel { get; set; } = "Close panel";
[Parameter]
public string? Title { get; set; }
[Parameter]
public RenderFragment? HeaderContent { get; set; }
[Parameter]
public RenderFragment? ChildContent { get; set; }
[Parameter]
public EventCallback OnClose { get; set; }
[Parameter]
public string? CssClass { get; set; }
private string BuildCssClass()
{
var classes = new List<string> { "surface-drawer", $"is-{Placement.Trim().ToLowerInvariant()}" };
if (!string.IsNullOrWhiteSpace(CssClass))
{
classes.Add(CssClass);
}
return string.Join(' ', classes);
}
private Task HandleCloseAsync() =>
OnClose.InvokeAsync();
}