ui/DashReminderPanel.razor

A UI Razor panel that displays a dash reminder with a key hint and a progress bar. It shows either "RB" or "Space" depending on controller use, animates a fill based on a timer, fades after a duration, and invokes OnComplete when finished.

File Access
@namespace Sandbox
@using Sandbox;
@using Sandbox.UI;
@using System;
@inherits Panel
@attribute [StyleSheet("DashReminderPanel.razor.scss")]

@{
	var keyText = Input.UsingController ? "RB" : "Space";
	var progress = Math.Clamp( 1f - ((float)_showTimer / _displayDuration), 0f, 1f );
	var isFading = (float)_showTimer > _displayDuration;
}

<root>
	<div class="dash-reminder @(isFading ? "fading" : "") @(_initialized ? "initialized" : "")">
		<div class="reminder-text">Press @keyText to dash</div>
		<div class="progress-bar-bg">
			<div class="progress-bar-fill" style="width: @(progress * 100f)%;"></div>
		</div>
	</div>
</root>

@code
{
	public Action OnComplete { get; set; }

	RealTimeSince _showTimer;
	bool _initialized;
	const float _displayDuration = 10f;
	const float _fadeDuration = 0.4f;

	protected override int BuildHash()
	{
		return HashCode.Combine( Input.UsingController, _initialized, (int)((float)_showTimer * 10f) );
	}

	protected override void OnAfterTreeRender( bool firstTime )
	{
		if ( firstTime )
			_showTimer = 0f;
	}

	public override void Tick()
	{
		_initialized = true;
		if ( (float)_showTimer > _displayDuration + _fadeDuration )
			OnComplete?.Invoke();
	}
}