From 97147438768f989660880c5bc6944da32e5bd529 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=A1clavek=2C=20Ond=C5=99ej?= <vaclavek@havit.cz>
Date: Thu, 9 Nov 2023 22:12:49 +0100
Subject: [PATCH 1/2] HxSearchBox - fix clear button padding if there is delete
 icon

---
 .../Forms/SearchBox/HxSearchBox.razor                     | 1 +
 .../Forms/SearchBox/HxSearchBox.razor.cs                  | 5 +++++
 .../Forms/SearchBox/HxSearchBox.razor.css                 | 8 ++++++--
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor
index c3c0a8446..f9ef65731 100644
--- a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor
+++ b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor
@@ -43,6 +43,7 @@
                     class="@CssClassHelper.Combine(
                        "form-control",
                        (!HasInputGroupEnd && HasInputGroups ? "hx-search-box-input-with-search-icon" : null),
+                       (HasClearButton ? "hx-search-box-input-with-clear-icon" : null),
                        InputCssClassEffective)" />
 
                 @if (!string.IsNullOrEmpty(Label) && LabelType == Havit.Blazor.Components.Web.Bootstrap.LabelType.Floating)
diff --git a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.cs b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.cs
index 878ec232a..29891ed14 100644
--- a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.cs
+++ b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.cs
@@ -218,6 +218,10 @@ public partial class HxSearchBox<TItem> : IAsyncDisposable
 	protected bool HasInputGroups => HasInputGroupStart || HasInputGroupEnd;
 	private bool HasInputGroupStart => !String.IsNullOrWhiteSpace(InputGroupStartText) || (InputGroupStartTemplate is not null);
 	private bool HasInputGroupEnd => !String.IsNullOrWhiteSpace(InputGroupEndText) || (InputGroupEndTemplate is not null);
+	private bool HasClearButton => !HasInputGroupEnd
+							&& !dataProviderInProgress
+							&& !string.IsNullOrEmpty(TextQuery)
+							&& (ClearIconEffective is not null);
 
 	private string dropdownToggleElementId = "hx" + Guid.NewGuid().ToString("N");
 	private string dropdownId = "hx" + Guid.NewGuid().ToString("N");
@@ -239,6 +243,7 @@ public partial class HxSearchBox<TItem> : IAsyncDisposable
 	private DotNetObjectReference<HxSearchBox<TItem>> dotnetObjectReference;
 	private bool clickIsComing;
 	private bool disposed = false;
+
 	public HxSearchBox()
 	{
 		dotnetObjectReference = DotNetObjectReference.Create(this);
diff --git a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
index f99c4def1..9012104c0 100644
--- a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
+++ b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
@@ -18,8 +18,12 @@
 }
 
 ::deep .hx-search-box-input-with-search-icon {
-    border-top-right-radius: 0.375rem !important;
-    border-bottom-right-radius: 0.375rem !important;
+	border-top-right-radius: 0.375rem !important;
+	border-bottom-right-radius: 0.375rem !important;
+}
+
+::deep .hx-search-box-input-with-clear-icon {
+	padding-right: 2rem;
 }
 
 .dropdown-item:not(:active) ::deep .hx-search-box-item-title {

From 2d5f760dd7981af96c19af8e64b5706ba1fdc375 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=A1clavek=2C=20Ond=C5=99ej?= <vaclavek@havit.cz>
Date: Tue, 21 Nov 2023 20:09:25 +0100
Subject: [PATCH 2/2] HxSearchBox - fix right button padding and test page

---
 BlazorAppTest/Pages/HxSearchBoxTest.razor          | 14 +++++++++++++-
 .../Forms/SearchBox/HxSearchBox.razor.css          |  2 +-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/BlazorAppTest/Pages/HxSearchBoxTest.razor b/BlazorAppTest/Pages/HxSearchBoxTest.razor
index 6faa5a44d..f9db4a8d9 100644
--- a/BlazorAppTest/Pages/HxSearchBoxTest.razor
+++ b/BlazorAppTest/Pages/HxSearchBoxTest.razor
@@ -1,6 +1,18 @@
 @page "/HxSearchBoxTest"
 
-<HxSearchBox DataProvider="ProvideSearchResults" Label="Search" ItemTitleSelector="(i) => i.Title" ItemSubtitleSelector="(i) => i.Subtitle" ItemIconSelector="(i) => i.Icon" TItem="SearchBoxItem" >
+<HxSearchBox DataProvider="ProvideSearchResults" Label="Search needle in a haystack" InputSize="InputSize.Small" ItemTitleSelector="(i) => i.Title" ItemSubtitleSelector="(i) => i.Subtitle" ItemIconSelector="(i) => i.Icon" TItem="SearchBoxItem">
+    <DefaultContentTemplate>
+        <div class="small py-2 px-3 text-muted">Search for Mouse, Table or Door...</div>
+    </DefaultContentTemplate>
+</HxSearchBox>
+
+<HxSearchBox DataProvider="ProvideSearchResults" Label="Search regular stuff" InputSize="InputSize.Regular" ItemTitleSelector="(i) => i.Title" ItemSubtitleSelector="(i) => i.Subtitle" ItemIconSelector="(i) => i.Icon" TItem="SearchBoxItem">
+    <DefaultContentTemplate>
+        <div class="small py-2 px-3 text-muted">Search for Mouse, Table or Door...</div>
+    </DefaultContentTemplate>
+</HxSearchBox>
+
+<HxSearchBox DataProvider="ProvideSearchResults" Label="Search huge things" InputSize="InputSize.Large" ItemTitleSelector="(i) => i.Title" ItemSubtitleSelector="(i) => i.Subtitle" ItemIconSelector="(i) => i.Icon" TItem="SearchBoxItem">
     <DefaultContentTemplate>
         <div class="small py-2 px-3 text-muted">Search for Mouse, Table or Door...</div>
     </DefaultContentTemplate>
diff --git a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
index 9012104c0..9125bc8b4 100644
--- a/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
+++ b/Havit.Blazor.Components.Web.Bootstrap/Forms/SearchBox/HxSearchBox.razor.css
@@ -23,7 +23,7 @@
 }
 
 ::deep .hx-search-box-input-with-clear-icon {
-	padding-right: 2rem;
+	padding-right: 2.375rem;
 }
 
 .dropdown-item:not(:active) ::deep .hx-search-box-item-title {