@@ -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 {