@namespace Sunless.Libraries.UI
@using System.Collections.Generic
@using Sandbox
@using Sandbox.UI
@inherits Panel
@attribute [StyleSheet]

<root class="menu-tile-grid">
	@if ( Items is not null )
	{
		for ( int i = 0; i < Items.Count; i++ )
		{
			var idx = i;
			var item = Items[idx];
			var active = idx == ( Active?.Invoke() ?? -1 );
			<div class="tile @(active ? "active" : "")" @onclick=@(() => Pick?.Invoke( idx ))>
				<div class="tile-swatch" style=@SwatchStyle(item)>
					<div class="tile-vignette"></div>
				</div>
				<div class="tile-label">@item.Label</div>
			</div>
		}
	}
</root>

@code
{
	public IReadOnlyList<MenuTileGridWidget.Item> Items { get; set; }
	public Func<int> Active { get; set; }
	public Action<int> Pick { get; set; }

	static string SwatchStyle( MenuTileGridWidget.Item item )
	{
		if ( !string.IsNullOrEmpty( item.Image ) )
			return $"background-image: url({item.Image})";
		if ( !string.IsNullOrEmpty( item.Color ) )
			return $"background-color: {item.Color}";
		return "";
	}

	protected override int BuildHash() => HashCode.Combine( Items?.Count ?? 0, Active?.Invoke() ?? -1 );
}