49 lines
1.7 KiB
Plaintext
49 lines
1.7 KiB
Plaintext
 
|
@inherits LocalizableComponentBase
|
||
|
|
|
||
|
|
@* Nerd stats on hover or focus: a DTooltip whose content is a monospace list of label/value rows. OnOpen runs on the
|
||
|
|
first hover or focus, for stats read on demand (a post's provenance); rows with no value are left out. *@
|
||
|
|
<DTooltip Placement="Placement" Align="Align" class="@Class" TipContent="Body" @onmouseenter="Open" @onfocusin="Open">
|
||
|
|
@ChildContent
|
||
|
|
</DTooltip>
|
||
|
|
|
||
|
|
@code {
|
||
|
|
[Parameter] public RenderFragment ChildContent { get; set; }
|
||
|
|
[Parameter] public string Heading { get; set; }
|
||
|
|
[Parameter] public IEnumerable<NerdRow> Rows { get; set; } = [];
|
||
|
|
/// <summary>Shown under the rows while OnOpen's work runs.</summary>
|
||
|
|
[Parameter] public bool Pending { get; set; }
|
||
|
|
[Parameter] public EventCallback OnOpen { get; set; }
|
||
|
|
[Parameter] public DTooltipPlacement Placement { get; set; }
|
||
|
|
[Parameter] public DTooltipAlign Align { get; set; }
|
||
|
|
[Parameter] public string Class { get; set; }
|
||
|
|
|
||
|
|
bool opened;
|
||
|
|
|
||
|
|
protected override void OnInitialized() => IsLoading = false;
|
||
|
|
|
||
|
|
async Task Open()
|
||
|
|
{
|
||
|
|
if (opened || !OnOpen.HasDelegate)
|
||
|
|
return;
|
||
|
|
opened = true;
|
||
|
|
await OnOpen.InvokeAsync();
|
||
|
|
}
|
||
|
|
|
||
|
|
RenderFragment Body => @<div class="nerd-stats flex flex-col gap-1 text-left font-mono text-[11px] leading-tight max-w-80">
|
||
|
|
@if (Heading is { Length: > 0 })
|
||
|
|
{
|
||
|
|
<p class="font-bold opacity-80">@Heading</p>
|
||
|
|
}
|
||
|
|
<dl class="grid grid-cols-[auto_minmax(0,1fr)] gap-x-2 gap-y-0.5">
|
||
|
|
@foreach (var row in Rows.Where(row => !string.IsNullOrEmpty(row.Value)))
|
||
|
|
{
|
||
|
|
<dt class="opacity-60 whitespace-nowrap">@row.Label</dt>
|
||
|
|
<dd class="break-all">@row.Value</dd>
|
||
|
|
}
|
||
|
|
</dl>
|
||
|
|
@if (Pending)
|
||
|
|
{
|
||
|
|
<p class="opacity-60">@Localizer["loading"]…</p>
|
||
|
|
}
|
||
|
|
</div>;
|
||
|
|
}
|