daniel-c-harvey
394b07f404
Use Fixed + RelativeWidth=Adaptive with BottomLeft/TopLeft origins to anchor the menu under the share button; drop the inline-block shrink-wrap container hack. Keep AutoClose off so the embed panel survives clicks.
79 lines
3.5 KiB
Plaintext
79 lines
3.5 KiB
Plaintext
@namespace DeepDrftPublic.Client.Controls
|
|
|
|
@* Overlay is viewport-level/fixed regardless of DOM nesting; placing it outside
|
|
the wrapper is harmless/cleaner but doesn't change its behavior.
|
|
AutoClose is deliberately OFF: its modeless pointer-down tracking closes the
|
|
popover on any click outside the overlay's DOM subtree — including the portaled
|
|
embed checkbox/copy-button — which kills the embed affordance. Backdrop
|
|
dismissal is handled by OnClick alone. *@
|
|
<MudOverlay Visible="@_open" OnClick="@Close" />
|
|
|
|
@* Activator and popover share this wrapper so MudPopover's anchoring reads the
|
|
button's bounding rect. No shrink-wrap sizing — width/min-width come from the
|
|
documented RelativeWidth="Adaptive" on the popover, not from container CSS. *@
|
|
<div>
|
|
<MudTooltip Text="Share">
|
|
<MudIconButton Icon="@Icons.Material.Filled.Share"
|
|
Size="Size.Large"
|
|
Color="Color.Secondary"
|
|
Disabled="@(!RendererInfo.IsInteractive)"
|
|
OnClick="@Toggle"
|
|
aria-label="@(IsReleaseMode ? "Share this release" : "Share this track")" />
|
|
</MudTooltip>
|
|
|
|
<MudPopover Open="@_open"
|
|
Fixed="true"
|
|
RelativeWidth="DropdownWidth.Adaptive"
|
|
AnchorOrigin="Origin.BottomLeft"
|
|
TransformOrigin="Origin.TopLeft"
|
|
Class="deepdrft-share-popover">
|
|
<MudStack Spacing="2" Class="deepdrft-share-popover-body">
|
|
|
|
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
|
|
<MudButton StartIcon="@Icons.Material.Filled.Link"
|
|
Variant="Variant.Text"
|
|
Color="Color.Primary"
|
|
OnClick="@CopyLink">
|
|
Copy link
|
|
</MudButton>
|
|
@if (_linkCopied)
|
|
{
|
|
<MudText Typo="Typo.caption" Color="Color.Success">Copied!</MudText>
|
|
}
|
|
</MudStack>
|
|
|
|
@* Embed is a single-track affordance only; a release page is not a single-track embed (§3b.3). *@
|
|
@if (!IsReleaseMode)
|
|
{
|
|
<MudDivider />
|
|
|
|
<MudCheckBox @bind-Value="Embed" Color="Color.Primary" Label="Embed player" Dense="true" />
|
|
|
|
@if (_embed)
|
|
{
|
|
<MudStack Row AlignItems="AlignItems.Center" Spacing="1">
|
|
<MudTextField Value="@EmbedSnippet"
|
|
T="string"
|
|
ReadOnly="true"
|
|
Variant="Variant.Outlined"
|
|
Lines="3"
|
|
Margin="Margin.Dense"
|
|
Class="deepdrft-share-embed-field" />
|
|
<MudStack AlignItems="AlignItems.Center" Spacing="0">
|
|
<MudIconButton Icon="@Icons.Material.Filled.ContentCopy"
|
|
Color="Color.Primary"
|
|
OnClick="@CopyEmbed"
|
|
aria-label="Copy embed snippet" />
|
|
@if (_embedCopied)
|
|
{
|
|
<MudText Typo="Typo.caption" Color="Color.Success">Copied!</MudText>
|
|
}
|
|
</MudStack>
|
|
</MudStack>
|
|
}
|
|
}
|
|
|
|
</MudStack>
|
|
</MudPopover>
|
|
</div>
|