thepraandClaude Opus 5.5
dd38002682
Below xl every feed tab but the selected one was a lone icon with no name, for a screen reader or a finger. DTab takes an AccessibleName, which DTabs renders as the tab's label and tooltip, and FeedTabs names each tab; on a phone every tab shows its name too. The strip is marked as one that scrolls sideways (data-scroll-x), says it holds the feeds, and on a phone fades at the edge where more tabs wait (edge-fade-x, a scroll-driven animation where the browser has one); the selected tab is brought into view when it changes (window.revealActive). Explore's tabs get the same. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw
24 lines
851 B
Plaintext
24 lines
851 B
Plaintext
@implements IDisposable
|
|
|
|
@* One tab of a DTabs: renders nothing itself; DTabs renders its Header as the tab button and its ChildContent as
|
|
the panel while it is active. *@
|
|
|
|
@code {
|
|
[CascadingParameter] DTabs Parent { get; set; }
|
|
[Parameter] public RenderFragment Header { get; set; }
|
|
[Parameter] public RenderFragment ChildContent { get; set; }
|
|
[Parameter] public bool Disabled { get; set; }
|
|
[Parameter] public string Class { get; set; }
|
|
/// <summary>The tab's name for a screen reader and as its tooltip, when its Header shows only an icon.</summary>
|
|
[Parameter] public string AccessibleName { get; set; }
|
|
|
|
protected override void OnInitialized()
|
|
{
|
|
if (Parent is null)
|
|
throw new InvalidOperationException($"{nameof(DTab)} must be inside a {nameof(DTabs)}.");
|
|
Parent.Add(this);
|
|
}
|
|
|
|
public void Dispose() => Parent?.Remove(this);
|
|
}
|