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

@* Renders the engine's input-glyph SVG for an action or raw key. Falls back to
   a text pill when the engine doesn't ship a usable SVG for the binding. *@

<root class="input-glyph @ExtraClass">
	<img @ref="GlyphImg" />
	@if ( !_hasTexture && !string.IsNullOrEmpty( Fallback ) )
	{
		<div class="input-glyph__fallback">@Fallback</div>
	}
</root>

@code
{
	public string Action { get; set; }
	public string Key { get; set; }
	public string Fallback { get; set; }
	// Medium = 128px source SVG. Small (32px) reads blurry once CSS scales it
	// up — bigger source + CSS downscale stays crisp.
	public InputGlyphSize Size { get; set; } = InputGlyphSize.Medium;
	public string ExtraClass { get; set; } = "";

	public Image GlyphImg { get; set; }

	bool _hasTexture;

	void UpdateTexture()
	{
		if ( GlyphImg is null ) return;

		Texture tex = null;
		if ( !string.IsNullOrEmpty( Action ) )
		{
			tex = Input.GetGlyph( Action, Size, outline: true );
		}
		else if ( !string.IsNullOrEmpty( Key ) )
		{
			tex = Input.Keyboard.GetGlyph( Key, Size, outline: true );
		}

		GlyphImg.Texture = tex;
		_hasTexture = tex is not null;
	}

	protected override void OnAfterTreeRender( bool firstTime )
	{
		base.OnAfterTreeRender( firstTime );
		UpdateTexture();
	}

	protected override int BuildHash() => HashCode.Combine( Action, Key, Fallback, Size, ExtraClass );
}