diff --git a/src/Blazored.Typeahead/BlazoredTypeahead.razor b/src/Blazored.Typeahead/BlazoredTypeahead.razor index c6d7350..29edf68 100644 --- a/src/Blazored.Typeahead/BlazoredTypeahead.razor +++ b/src/Blazored.Typeahead/BlazoredTypeahead.razor @@ -3,7 +3,7 @@ @typeparam TItem @typeparam TValue -
+
@@ -82,7 +82,7 @@ @onkeyup:preventDefault="@PreventDefault" @onfocus="HandleInputFocus" autocomplete="off" - @attributes="AdditionalAttributes" + @attributes="_capturedAttributes" type="text" class="blazored-typeahead__input blazored-typeahead__input-multi" />
@@ -112,7 +112,7 @@ @onkeyup:preventDefault="@PreventDefault" @onfocus="HandleInputFocus" autocomplete="off" - @attributes="AdditionalAttributes" + @attributes="_capturedAttributes" type="text" class="blazored-typeahead__input @(IsShowingMask ? "blazored-typeahead__input-hidden" : null)" /> } diff --git a/src/Blazored.Typeahead/BlazoredTypeahead.razor.cs b/src/Blazored.Typeahead/BlazoredTypeahead.razor.cs index 511f6a7..81c07da 100644 --- a/src/Blazored.Typeahead/BlazoredTypeahead.razor.cs +++ b/src/Blazored.Typeahead/BlazoredTypeahead.razor.cs @@ -16,6 +16,9 @@ public partial class BlazoredTypeahead : ComponentBase, IDisposab private bool _eventsHookedUp = false; private ElementReference _searchInput; private ElementReference _mask; + private IReadOnlyDictionary? _capturedAttributes; + private string _classAttribute = string.Empty; + private string _styleAttribute = string.Empty; [Inject] private IJSRuntime JSRuntime { get; set; } @@ -40,7 +43,7 @@ public partial class BlazoredTypeahead : ComponentBase, IDisposab [Parameter] public RenderFragment HeaderTemplate { get; set; } [Parameter] public RenderFragment FooterTemplate { get; set; } - [Parameter(CaptureUnmatchedValues = true)] public IReadOnlyDictionary AdditionalAttributes { get; set; } + [Parameter(CaptureUnmatchedValues = true)] public IReadOnlyDictionary? AdditionalAttributes { get; set; } [Parameter] public int MinimumLength { get; set; } = 1; [Parameter] public int Debounce { get; set; } = 300; [Parameter] public int MaximumSuggestions { get; set; } = 10; @@ -108,6 +111,8 @@ protected override void OnInitialized() throw new InvalidOperationException($"{GetType()} requires a {nameof(ResultTemplate)} parameter."); } + _capturedAttributes = CaptureCssAttributes(AdditionalAttributes); + _debounceTimer = new System.Timers.Timer(); _debounceTimer.Interval = Debounce; _debounceTimer.AutoReset = false; @@ -140,6 +145,27 @@ private void Initialize() IsShowingMask = Value != null; } + private IReadOnlyDictionary? CaptureCssAttributes(IReadOnlyDictionary? additionalAttributes) + { + if (additionalAttributes == null) + { + return null; + } + + var capturedAttributes = additionalAttributes.ToDictionary(k => k.Key, v => v.Value); + if (capturedAttributes.ContainsKey("class")) + { + _classAttribute = Convert.ToString(capturedAttributes["class"]) ?? string.Empty; + capturedAttributes.Remove("class"); + } + if (capturedAttributes.ContainsKey("style")) + { + _styleAttribute = Convert.ToString(capturedAttributes["style"]) ?? string.Empty; + capturedAttributes.Remove("style"); + } + return capturedAttributes; + } + private async Task RemoveValue(TValue item) { var valueList = Values ?? new List(); diff --git a/src/Blazored.Typeahead/wwwroot/blazored-typeahead.css b/src/Blazored.Typeahead/wwwroot/blazored-typeahead.css index bced5c4..cac7662 100644 --- a/src/Blazored.Typeahead/wwwroot/blazored-typeahead.css +++ b/src/Blazored.Typeahead/wwwroot/blazored-typeahead.css @@ -27,6 +27,8 @@ border: none; padding: .5rem; border-radius: 5px; + color: inherit; + background-color: inherit; } .blazored-typeahead:focus-within {