@inject ISearchService SearchService
@inject NavigationManager NavigationManager
@inject IJSRuntime JsRuntime

<button id="@Id" class="searchIconButtonContainer" @onclick="ButtonClicked">
    <div class="searchIcon">
        <i class="fa-solid fa-magnifying-glass"></i>
    </div>
</button>

<style>
    .searchIconButtonContainer {
        border-radius: 8px;
        font-weight: 800;
        width: 100%;
        padding: 5px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .searchIcon {
        font-size: 28px;
        text-align: center;
        margin: auto;
    }
</style>

@code {

    [Parameter] public RenderFragment ChildContent { get; set; } = default!;

    [Parameter] public string Id { get; set; } = default!;

    private void ButtonClicked(EventArgs eventArgs)
    {
        SearchService.Show();
    }

}