From 877e8dd5ea3acbf5f6eec56afa7a3bf6a738045b Mon Sep 17 00:00:00 2001
From: mckaragoz <78308169+mckaragoz@users.noreply.github.com>
Date: Wed, 23 Apr 2025 01:29:01 +0300
Subject: [PATCH] Fix Input Sizing

---
 .../Pages/VisualTest.razor                    | 30 ++++++++++++++++
 .../Base/MudBaseInputExtended.cs              |  7 ++++
 .../MudInputCssHelperExtended.cs              |  2 +-
 .../SelectExtended/MudSelectExtended.razor    | 36 ++++++++++---------
 .../MudTextFieldExtended.razor                |  1 +
 5 files changed, 59 insertions(+), 17 deletions(-)
 create mode 100644 CodeBeam.MudBlazor.Extensions.Docs/Pages/VisualTest.razor

diff --git a/CodeBeam.MudBlazor.Extensions.Docs/Pages/VisualTest.razor b/CodeBeam.MudBlazor.Extensions.Docs/Pages/VisualTest.razor
new file mode 100644
index 00000000..0de798c0
--- /dev/null
+++ b/CodeBeam.MudBlazor.Extensions.Docs/Pages/VisualTest.razor
@@ -0,0 +1,30 @@
+@page "/visualtest"
+
+<MudStack>
+    <MudStack Row="true">
+        <MudSelect T="string" />
+        <MudSelectExtended T="string" />
+    </MudStack>
+    <MudStack Row="true">
+        <MudSelect T="string" Variant="Variant.Outlined" />
+        <MudSelectExtended T="string" Variant="Variant.Outlined" />
+    </MudStack>
+    <MudStack Row="true">
+        <MudSelect T="string" Variant="Variant.Filled" />
+        <MudSelectExtended T="string" Variant="Variant.Filled" />
+    </MudStack>
+
+    <MudStack Row="true">
+        <MudTextField T="string" />
+        <MudTextFieldExtended T="string" />
+    </MudStack>
+    <MudStack Row="true">
+        <MudTextField T="string" Variant="Variant.Outlined" />
+        <MudTextFieldExtended T="string" Variant="Variant.Outlined" />
+    </MudStack>
+    <MudStack Row="true">
+        <MudTextField T="string" Variant="Variant.Filled" />
+        <MudTextFieldExtended T="string" Variant="Variant.Filled" />
+    </MudStack>
+</MudStack>
+
diff --git a/CodeBeam.MudBlazor.Extensions/Base/MudBaseInputExtended.cs b/CodeBeam.MudBlazor.Extensions/Base/MudBaseInputExtended.cs
index 75ae60d8..09c87e62 100644
--- a/CodeBeam.MudBlazor.Extensions/Base/MudBaseInputExtended.cs
+++ b/CodeBeam.MudBlazor.Extensions/Base/MudBaseInputExtended.cs
@@ -59,6 +59,13 @@ protected MudBaseInputExtended() : base(new DefaultConverter<T>()) { }
         /// </summary>
         [Parameter] public EventCallback OnChange { get; set; }
 
+        /// <summary>
+        /// Set the text-align on the component.
+        /// </summary>
+        [Parameter]
+        [Category(CategoryTypes.Text.Appearance)]
+        public Typo Typo { get; set; } = Typo.subtitle1;
+
         /// <summary>
         /// If true, the input will take up the full width of its container.
         /// </summary>
diff --git a/CodeBeam.MudBlazor.Extensions/Components/InputExtended/MudInputCssHelperExtended.cs b/CodeBeam.MudBlazor.Extensions/Components/InputExtended/MudInputCssHelperExtended.cs
index 8afe1aab..9b2466b9 100644
--- a/CodeBeam.MudBlazor.Extensions/Components/InputExtended/MudInputCssHelperExtended.cs
+++ b/CodeBeam.MudBlazor.Extensions/Components/InputExtended/MudInputCssHelperExtended.cs
@@ -28,7 +28,7 @@ public static string GetClassname<T>(MudBaseInputExtended<T> baseInput, Func<boo
                 .AddClass("mud-disabled", baseInput.Disabled)
                 .AddClass("mud-input-error", baseInput.HasErrors)
                 .AddClass("mud-ltr", baseInput.GetInputType() == InputType.Email || baseInput.GetInputType() == InputType.Telephone)
-                //.AddClass($"mud-typography-{baseInput.Typo.ToDescriptionString()}")
+                .AddClass($"mud-typography-{baseInput.Typo.ToDescriptionString()}")
                 .AddClass(baseInput.Class)
                 .Build();
 
diff --git a/CodeBeam.MudBlazor.Extensions/Components/SelectExtended/MudSelectExtended.razor b/CodeBeam.MudBlazor.Extensions/Components/SelectExtended/MudSelectExtended.razor
index cb3d77d6..90b58dff 100644
--- a/CodeBeam.MudBlazor.Extensions/Components/SelectExtended/MudSelectExtended.razor
+++ b/CodeBeam.MudBlazor.Extensions/Components/SelectExtended/MudSelectExtended.razor
@@ -27,13 +27,13 @@
                                 @if (Strict && !IsValueInList)
                                 {
                                     //Show nothing
-                                    <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                    <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
                                 }
                                 @if (ValuePresenter == ValuePresenter.Text)
                                 {
                                     if (string.IsNullOrEmpty(Text))
                                     {
-                                        <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                        <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
                                     }
 
                                     <MudRender>@GetSelectTextPresenter()</MudRender>
@@ -42,7 +42,7 @@
                                 {
                                     if (SelectedValues == null || !SelectedValues.Any())
                                     {
-                                        <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                        <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
                                     }
                                     <MudChipSet T="T" Class="d-flex flex-wrap mud-width-full" Style="row-gap: 4px" AllClosable="ChipCloseable" OnClose="ChipClosed">
                                         @if (ItemCollection != null)
@@ -65,7 +65,7 @@
                                 {
                                     if (SelectedListItem == null)
                                     {
-                                        <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                        <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
 
                                     }
                                     else if (ItemTemplate != null)
@@ -76,7 +76,7 @@
                                         }
                                         else if (!string.IsNullOrEmpty(Placeholder))
                                         {
-                                            <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                            <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
                                         }
                                     }
                                     else if (SelectedListItem.ChildContent != null)
@@ -87,7 +87,7 @@
                                     {
                                         @if (string.IsNullOrEmpty(Text))
                                         {
-                                            <MudText Typo="Typo.body1" Class="mud-text-secondary">@Placeholder</MudText>
+                                            <MudText Typo="@Typo" Class="mud-text-secondary">@Placeholder</MudText>
                                         }
 
                                         <MudRender>@GetSelectTextPresenter()</MudRender>
@@ -108,16 +108,20 @@
                             @StaticContent(this)
                         }
 
-                        <CascadingValue Value="@this" IsFixed="true">
-                            <MudListExtended @ref="@_list" T="T" @bind-SelectedValue="@Value" Style="@($"overflow-y:auto; max-height: {MaxHeight}px")" @bind-SelectedValues="@SelectedValues" @bind-SelectedItem="@SelectedListItem" @bind-SelectedItems="@SelectedListItems"
-                                             Clickable="true" Color="@Color" Dense="@Dense" ItemCollection="@ItemCollection" Virtualize="@Virtualize" Padding="@EnablePopoverPadding" EnableSelectedItemStyle="@EnableSelectedItemStyle"
-                                             MultiSelection="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MultiSelectionAlign="@MultiSelectionAlign" SelectAll="@SelectAll" SelectAllPosition="@SelectAllPosition" SelectAllText="@SelectAllText"
-                                             CheckedIcon="@CheckedIcon" UncheckedIcon="@UncheckedIcon" IndeterminateIcon="@IndeterminateIcon" SelectValueOnTab="@SelectValueOnTab" Comparer="@Comparer"
-                                             ItemTemplate="@ItemTemplate" ItemSelectedTemplate="@ItemSelectedTemplate" ItemDisabledTemplate="@ItemDisabledTemplate" SearchBox="@SearchBox" SearchBoxAutoFocus="@SearchBoxAutoFocus" SearchFunc="@SearchFunc" SearchBoxPlaceholder="@SearchBoxPlaceholder"
-                                             SearchBoxClearable="@SearchBoxClearable" SearchBoxVariant="@SearchBoxVariant" SearchBoxAdornment="SearchBoxAdornment" ToStringFunc="@ToStringFunc" OnSearchStringChange="@OnSearchStringChange">
-                                @ChildContent
-                            </MudListExtended>
-                        </CascadingValue>
+                        @if (ItemCollection != null || ChildContent != null)
+                        {
+                            <CascadingValue Value="@this" IsFixed="true">
+                                <MudListExtended @ref="@_list" T="T" @bind-SelectedValue="@Value" Style="@($"overflow-y:auto; max-height: {MaxHeight}px")" @bind-SelectedValues="@SelectedValues" @bind-SelectedItem="@SelectedListItem" @bind-SelectedItems="@SelectedListItems"
+                                                 Clickable="true" Color="@Color" Dense="@Dense" ItemCollection="@ItemCollection" Virtualize="@Virtualize" Padding="@EnablePopoverPadding" EnableSelectedItemStyle="@EnableSelectedItemStyle"
+                                                 MultiSelection="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MultiSelectionAlign="@MultiSelectionAlign" SelectAll="@SelectAll" SelectAllPosition="@SelectAllPosition" SelectAllText="@SelectAllText"
+                                                 CheckedIcon="@CheckedIcon" UncheckedIcon="@UncheckedIcon" IndeterminateIcon="@IndeterminateIcon" SelectValueOnTab="@SelectValueOnTab" Comparer="@Comparer"
+                                                 ItemTemplate="@ItemTemplate" ItemSelectedTemplate="@ItemSelectedTemplate" ItemDisabledTemplate="@ItemDisabledTemplate" SearchBox="@SearchBox" SearchBoxAutoFocus="@SearchBoxAutoFocus" SearchFunc="@SearchFunc" SearchBoxPlaceholder="@SearchBoxPlaceholder"
+                                                 SearchBoxClearable="@SearchBoxClearable" SearchBoxVariant="@SearchBoxVariant" SearchBoxAdornment="SearchBoxAdornment" ToStringFunc="@ToStringFunc" OnSearchStringChange="@OnSearchStringChange">
+                                    @ChildContent
+                                </MudListExtended>
+                            </CascadingValue>
+                        }
+                        
 
                         @if (StaticContent != null && ShowStaticContentAtEnd)
                         {
diff --git a/CodeBeam.MudBlazor.Extensions/Components/TextFieldExtended/MudTextFieldExtended.razor b/CodeBeam.MudBlazor.Extensions/Components/TextFieldExtended/MudTextFieldExtended.razor
index 2e22af0d..2e2f5c7f 100644
--- a/CodeBeam.MudBlazor.Extensions/Components/TextFieldExtended/MudTextFieldExtended.razor
+++ b/CodeBeam.MudBlazor.Extensions/Components/TextFieldExtended/MudTextFieldExtended.razor
@@ -55,6 +55,7 @@
                                       Pattern="@Pattern"
                                       AutoSize="AutoSize"
                                       ShrinkLabel="@ShrinkLabel"
+                                      Typo="@Typo"
                                       ShowVisualiser="@(DataVisualiser != null && ShowVisualiser)"
                                       DataVisualiserStyle="@(DataVisualiser != null ? "min-height: 1.1876em" : null)">
                                     <DataVisualiser>