40 lines
1.2 KiB
Plaintext
40 lines
1.2 KiB
Plaintext
@namespace NexusReader.UI.Shared.Components.Atoms
|
||
|
||
<div class="nexus-search-container @(IsActive ? "active" : "")">
|
||
<div class="search-wrapper">
|
||
<i class="nexus-icon @IconClass"></i>
|
||
<input type="text"
|
||
@bind="SearchValue"
|
||
@bind:event="oninput"
|
||
@onkeypress="HandleKeyPress"
|
||
placeholder="@Placeholder"
|
||
class="nexus-search-input" />
|
||
@if (!string.IsNullOrEmpty(SearchValue))
|
||
{
|
||
<button class="clear-btn" @onclick="ClearSearch">×</button>
|
||
}
|
||
</div>
|
||
</div>
|
||
|
||
@code {
|
||
[Parameter] public string Placeholder { get; set; } = "Search your library...";
|
||
[Parameter] public string IconClass { get; set; } = "bi bi-search";
|
||
[Parameter] public EventCallback<string> OnSearch { get; set; }
|
||
|
||
private string SearchValue { get; set; } = string.Empty;
|
||
private bool IsActive => !string.IsNullOrEmpty(SearchValue);
|
||
|
||
private async Task HandleKeyPress(KeyboardEventArgs e)
|
||
{
|
||
if (e.Key == "Enter")
|
||
{
|
||
await OnSearch.InvokeAsync(SearchValue);
|
||
}
|
||
}
|
||
|
||
private void ClearSearch()
|
||
{
|
||
SearchValue = string.Empty;
|
||
}
|
||
}
|