Ui/Punchboard/PbTabs.razor

A Blazor component that renders a list of selectable tabs. It iterates through a list of strings and uses parameters to manage the currently selected tab.

@namespace CitySim.Punchboard
@using Sandbox.UI
@inherits Panel

<root class="pb-tabs">
	@if ( Items != null )
	{
		@for ( var i = 0; i < Items.Count; i++ )
		{
			var index = i;
			<div class="pb-tab @(index == Selected ? "selected" : "")" onclick=@(() => Select(index))>@Items[index]</div>
		}
	}
</root>

@code
{
	[Parameter] public List<string> Items { get; set; }
	[Parameter] public int Selected { get; set; }

	/// <summary>Called with the index of the clicked tab. Update Selected in the parent.</summary>
	[Parameter] public Action<int> SelectedChanged { get; set; }

	void Select(int index) { if (index == Selected) return; TabletopAudio.Switch(); SelectedChanged?.Invoke(index); }

	protected override int BuildHash() => HashCode.Combine(GameText.LanguageCode, HashCode.Combine( Selected, Items == null ? 0 : string.Join( "|", Items ).GetHashCode() ));
}