@using System.Collections.Generic

<h2>Focus and activation</h2>

<p onfocusin="@OnFocusIn" onfocusout="@OnFocusOut">
    Input: <input id="input" type="text" onfocus="@OnFocus" onblur="@OnBlur"/>
</p>
<p>
    Output: <span id="output">@message</span>
</p>
<p>
    <button onclick="@Clear">Clear</button>
</p>

<p>
    Another input (to distract you) <input id="other" />
</p>

@functions {

    string message;

    void OnFocus(UIFocusEventArgs e)
    {
        message += "onfocus,";
        StateHasChanged();
    }

    void OnBlur(UIFocusEventArgs e)
    {
        message += "onblur,";
        StateHasChanged();
    }

    void OnFocusIn(UIFocusEventArgs e)
    {
        message += "onfocusin,";
        StateHasChanged();
    }

    void OnFocusOut(UIFocusEventArgs e)
    {
        message += "onfocusout,";
        StateHasChanged();
    }

    void Clear()
    {
        message = string.Empty;
    }
}