ui/richtext/RichTextShopItemIcon.razor

A UI Razor component for rich text that renders a small shop item icon. It implements IRichTextPanel, parses an item id from rich text, looks up the item in ProgressManager.ShopItems, shows its icon as a background image, and sets/clears hovered item references on mouse over/out and deletion.

File Access
@namespace Sandbox
@using Sandbox;
@using Sandbox.UI;
@using System;
@inherits Panel
@implements IRichTextPanel
@attribute [RichTextPanel( @"\[item:([\w_]+)\]" )]

<root class="richtext-shop-item-icon">
	@if ( _item.HasValue )
	{
		<div class="image" style="background-image: url( @_item.Value.IconPath )"></div>
	}
</root>

<style>
	.richtext-shop-item-icon {
		position: relative;
		width: 24px;
		height: 24px;
		flex-shrink: 0;
		pointer-events: all;
		cursor: default;

		.image {
			position: relative;
			width: 100%;
			height: 100%;
			background-position: center;
			background-size: cover;
		}
	}
</style>

@code
{
	ShopItemDef? _item;
	public float? ImageSize { get; set; }

	public void ParseRichText( string text )
	{
		var def = ProgressManager.ShopItems.FirstOrDefault( d => d.Id == text );
		_item = def.Id != null ? def : null;
	}

	protected override void OnMouseOver( MousePanelEvent e )
	{
		if ( !_item.HasValue ) return;

		Manager.Instance.HoveredShopItem = _item;
		Manager.Instance.HoveredShopItemPanel = this;
	}

	protected override void OnMouseOut( MousePanelEvent e )
	{
		if ( Manager.Instance.HoveredShopItemPanel != this ) return;
		Manager.Instance.HoveredShopItem = null;
		Manager.Instance.HoveredShopItemPanel = null;
	}

	public override void OnDeleted()
	{
		base.OnDeleted();
		if ( Manager.Instance.HoveredShopItemPanel != this ) return;
		Manager.Instance.HoveredShopItem = null;
		Manager.Instance.HoveredShopItemPanel = null;
	}

	protected override int BuildHash() => HashCode.Combine( _item?.Id );
}