Merge fix-share-embed into dev (anchor SharePopover via documented MudPopover RelativeWidth; restore track-mode embed affordance)

This commit is contained in:
daniel-c-harvey
2026-06-17 06:42:10 -04:00
2 changed files with 14 additions and 19 deletions
@@ -1,14 +1,17 @@
@namespace DeepDrftPublic.Client.Controls @namespace DeepDrftPublic.Client.Controls
@* Overlay is viewport-level/fixed regardless of DOM nesting; placing it outside @* Overlay is viewport-level/fixed regardless of DOM nesting; placing it outside
the wrapper is harmless/cleaner but doesn't change its behavior. *@ the wrapper is harmless/cleaner but doesn't change its behavior.
<MudOverlay Visible="@_open" OnClick="@Close" AutoClose="true" /> 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" />
@* display:inline-block is the load-bearing property: it shrink-wraps this div @* Activator and popover share this wrapper so MudPopover's anchoring reads the
to the button, so MudPopover's portal reads the button's tight bounding rect button's bounding rect. No shrink-wrap sizing — width/min-width come from the
(via parentNode.getBoundingClientRect()) rather than a page-wide flow box. documented RelativeWidth="Adaptive" on the popover, not from container CSS. *@
position:relative is incidental. *@ <div>
<div class="deepdrft-share-popover-anchor">
<MudTooltip Text="Share"> <MudTooltip Text="Share">
<MudIconButton Icon="@Icons.Material.Filled.Share" <MudIconButton Icon="@Icons.Material.Filled.Share"
Size="Size.Large" Size="Size.Large"
@@ -19,9 +22,10 @@
</MudTooltip> </MudTooltip>
<MudPopover Open="@_open" <MudPopover Open="@_open"
Fixed="false" Fixed="true"
AnchorOrigin="Origin.BottomRight" RelativeWidth="DropdownWidth.Adaptive"
TransformOrigin="Origin.TopRight" AnchorOrigin="Origin.BottomLeft"
TransformOrigin="Origin.TopLeft"
Class="deepdrft-share-popover"> Class="deepdrft-share-popover">
<MudStack Spacing="2" Class="deepdrft-share-popover-body"> <MudStack Spacing="2" Class="deepdrft-share-popover-body">
@@ -358,15 +358,6 @@ h2, h3, h4, h5, h6,
font-family: var(--deepdrft-font-mono) !important; font-family: var(--deepdrft-font-mono) !important;
} }
/* display:inline-block is load-bearing: it shrink-wraps the wrapper to the
button so MudPopover's portal reads the button's tight bounding rect
(parentNode.getBoundingClientRect()) instead of a page-wide flow box.
position:relative is incidental — do not drop inline-block. */
.deepdrft-share-popover-anchor {
position: relative;
display: inline-block;
}
.deepdrft-share-popover-body { .deepdrft-share-popover-body {
padding: 0.75rem 1rem; padding: 0.75rem 1rem;
min-width: 280px; min-width: 280px;